Ошибки при создании экранных форм

При создании внешнего вида диалогового окна следует придерживаться нескольких достаточно простых правил:

• Использовать шрифт одного начертания, размера и цвета. Как правило, шрифт устанавливается для формы и для всех визуальных элементов свойство ParentFont устанавливается в True.
• Выравнивать группы элементов по левому краю. Устанавливать одинаковые расстояния между элементами в группе. Использовать одинаковые промежутки от элементов (групп элементов) до края формы.
• Использовать одинаковую высоту для однотипных визуальных элементов.
• Ширину полей ввода устанавливать в соответствии с типом данных.
• Контролировать порядок табуляции: слева-направо, сверху-вниз.
• Не перегружать форму нефункциональными визуальными элементами (рамками, панелями, разделительными линиями). В тоже время помнить, что умеренное использование таких элементов для выделения и группировки логически связанных эелементов управления способно существенно упростить чтение формы.
• Для привязки визуальных элементов к краям формы изменяемого размера использовать панели с установленным свойством выравнивания (Align), вместо якорей (Anchor).
• Экономно использовать рабочее пространство формы.

В качестве примера удачной и неудачной компоновки рассмотрим несколько экранных форм.

Документ "Выдача на сервис" из настройки СТО

Ниже представлен исходный вид формы:

Обратите внимание, как нерационально используется место на вкладках "Основные" и особенно "Аттрибуты". При попытке изменить размер формы кнопки пропадают с экрана:

Ремонт формы начнем с набора вкладок. Переместим единственный чек-бокс с вкладки "Аттрибуты" и расположим экранные элементы в три строки вместо пяти. Уменьшим и выровняем все промежутки. Уменьшим высоту разделительной линии (Splitter). Проблему с пропаданием кнопок решим следующим образом:

1. Внизу окна расположим панель usrg_pnlBtm, установив для нее Align=alBottom.
2. На ней разместим две панели: usrg_pnlLeft и usrg_pnlRight с выравнивание влево и вправо соответственно.
3. На левую панель перенесем (команда Вырезать и, затем, Вставить, из контекстного меню) кнопки "Новый", "Меню", "Справка". На правую -- "Ок" и "Отмена".
4. Визуальные границы панелей сделаем плоскими.
5. Для главной панели формы -- pnlMain -- установим свойство Align=alClient.

В итоге, преобразованная форма примет следующий вид: