Компонент Panel (Панель)

Компонент Panel находится на вкладке Standard и применяется для улучшения внешнего вида формы, а также для группировки нескольких компонентов. Этот компонент по своим свойствам немного напоминает форму. Если установить несколько других компонентов на Panel, то при смещении панели будут смещаться и компоненты, установленные на ней.

Изучим этот компонент на практике. Создайте новый проект, и установите на форму один компонент Panel. По умолчанию, свойству Caption панели присваивается то же имя, что и свойству Name, то есть прямо по центру панели выходит текст "Panel1". Нас это не устраивает. Очистим свойство Caption панели – просто удалите этот текст, ничего туда не вписывая.

Разберем другие полезные свойства этого компонента. Свойства семейства Bevel отвечают за внешний вид компонента:

BevelIner и BevelOuter имеют одинаковые значения, и отвечают за то, какой панель будет выглядеть – выпуклой или вогнутой. Попробуйте изменять значения этих свойств, и Вы все поймете.

BevelWidth указывает ширину оборки панели. Попробуйте изменить значение на 5. Панель выглядит экзотично, но не профессионально, лучше у этого свойства оставлять значение по умолчанию.

Еще одно очень важное свойство – Align (Выравнивание). Это свойство часто используют не только у панелей, но и у многих других компонентов. Align имеет несколько значений:

· AlBottom – указывает, что панель будет занимать весь низ формы. Когда размеры формы меняются, меняется и размер панели, но она по-прежнему занимает весь низ.

· AlClient – указывает, что панель занимает все пространство формы. Если вы установили панель, и растянули ее по всему верху, а затем установили еще одну панель и указали значение alClient, то вторая панель займет все оставшееся место.

· AlCustom – указывает пользовательские настройки. При изменении размеров формы такая панель останется, как при разработке дизайна.

· AlLeft – занимает всю левую часть формы.

· AlNone – выравнивания нет. Работает практически как AlCustom.

· AlRight – занимает всю правую часть формы.

· AlTop – панель вытягивается по всей верхней части формы.

Ранее мы создавали простой редактор текстов. Улучшим этот пример. Укажите у свойства Height (высота) панели значение 40. Свойство Top установите в 0. Тем самым мы прижали панель к самому верху формы. Свойству Align присваиваем значение alTop, растягивая панель по всему верхнему краю. Теперь, если пользователь станет менять размеры формы, сжимая окно или наоборот, растягивая, панель все равно будет занимать весь верх. Устанавливая на эту панель кнопки, мы получим типичную панель инструментов. Так и сделаем: установите на панель три кнопки, одну рядом с другой. На кнопках должен быть текст: "Сохранить", "Загрузить" и "Очистить".

На оставшееся внизу место помещаем компонент Memo, дважды щелкаем по свойству Lines, чтобы вызвать редактор текста, и удаляем из Memo весь текст. Свойству Align компонента Memo присвоим значение alClient, чтобы растянуть Memo по всему оставшемуся месту. Вот и все, мы имеем панель инструментов и рабочую область редактора текстов. Сохраните проект, скомпилируйте его и посмотрите, как меняются размеры панели и Memo при изменении размера окна. Запрограммировать кнопки вы сможете самостоятельно, используя пример из второй лекции.