Lazarus. Урок 5. Button1 та її OnClick

Привіт. З сьогоднішнього дня ми починаємо поступово знайомитись із "компонентами" середовища Lazarus за допомогою яких будемо вчитись будувати інтерфейс наших програм.
Усі компоненти розташовуються у головному вікні Lazarus.

І першим компонентом буде звичайна кнопка або Button1.

Button1 або Кнопка звичайна. 

Головне призначення дати можливість користувачеві зрозуміти, що якщо він її натисне - отримає якийсь результат.

Отож давайте додамо її на форму. Для цього клацніть по кнопці в палітрі компонентів, а потім клацніть по формі. В тому місці з’явиться наша кнопка. 

Давайте відразу ж подивимось на її властивості.

Я думаю, що всі звернули увагу на текст який відображається на кнопці - Button1. А у вікні Інспектора об’єктів (на малюнку) виділена властивість яка відповідає за напис на кнопці. І дійсно, навіщо ж вигадувати велосипед, якщо буде дуже зручно щоб Caption означав теж саме, що й для форми і для інших компонентів з якими ми будемо знайомитись. А ще таке ж саме значення (Button1) має властивість Name. Але як і у випадку з формою, властивість Name - визначає ім’я об’єкта для програми. Це важливо. А  Caption лише відповідає за текст, який ми бачимо на кнопці. Значення властивості Name відображається в групі Components вікна Інспектора об’єктів. Тому:

змінюючи значення Caption - ми ніяк не вплинемо на роботу програми і доступ до самої кнопки;

змінивши значення Name - ми повинні надалі використовувати його в тексті програми для доступу до цієї ж кнопки.

Корисні властивості

Погортайте список властивостей кнопки і Ви побачите вже знайомі Вам Width, Height, Left, Top. Але тепер ці значення вже будуть стосуватися кнопки, а не форми. А властивості Left і Top будуть визначати положення кнопки відносно форми, а не екрану.

Якщо для якогось обробника події ми напишемо код Button1.Left:=0; Button1.Top:=0; то наша кнопка "прилипне" до верхнього лівого кута форми.

А ще кнопка та й багато інших компонентів має дуже цікаву властивість - Visible;

Visible - властивіть яка вказує на видимість об’єкта. Властивість може набувати двох значень

True i False (Так і Ні). 

Завдання

1. Виділіть кнопку
2. У вікні Інспектора об’єктів знайдіть властивість Visible
3. Приберіть "галочку" напроти властивості  так, щоб значення змінилось на False

Виконали? Кнопка зникла? Ні....Правильно! У режимі дизайнера ця властивість не працює. Але запустіть програму на виконання (F9). І Ви побачите, а точніше не побачите... своєї кнопки.

 Але є ще одна цікава і інколи дуже корисна властивіть - Enabled.

Enabled - доступність об’єкта для маніпуляцій. Властивість може набувати двох значень

True i False (Так і Ні). 

Щоб побачити на практиці як це виглядає, спочатку перевірте чи видима у Вас кнопка. Вставновіть для кнопки значення властивості Visible на True. А тепер змініть значення властивості Enabled на False і знову запустіть програму.

Події

Основною подією на яку реагує кнопка - є звичайно ж OnClick. Тому давайте виділимо кнопку та у вікні Інспектора об’єктів відкриємо закладку Події і двічі клацнемо у полі праворуч від OnClick. У вікні редактора тексту Ви отримаєте код. 

procedure TForm1.Button1Click(Sender: TObject);

begin

//сюди додайте код

end;

Додайте до нього наступний код:       

Button1.Caption:='Кнопка';

Button1.Left:=0;

Button1.Top:=0;

Button1.Width:=Form1.Width;

Button1.Height:=Form1.Height;  

Подумайте, що відбудеться після того як Ви клацнете по кнопці після запуску програми? А тепер перевірте!

Завдання 1.

1. Створіть новий проект;
2. Додайте до форми дві кнопки;
3. Встановіть напис на 1-й кнопці - "Активна";
4. Встановіть напис на 2-й кнопці - "Не активна";
5. Зробіть другу кнопку неактивною.
6. Створіть обробники подій для обох кнопок, так, щоб при кліку на 1-у кнопку вона ставала не активною, а друга стала активною, а при кліку на 2-у кнопку все ставало навпаки.

Завдання 2.

1. Створіть новий проект;
2. Додайте до форми три кнопки;
3. Встановіть властивість Visible для трьох кнопок в False;
4. Створіть обробники подій для усіх кнопок так, щоб при кліку по 1-й, вона ховалась, а ставала видимою 2-га. При кліку по 2-й вона ховалась, а третя з’явилась, і тд.

Завдання 3.

1. Створіть новий проект;
2. Додайте до форми чотири кнопки;
3. Назвіть кнопки "Вліво", "Вправо", "Вгору", "Вниз";
4. Створіть обробники подій для кнопок так, щоб при кліку на відповідну кнопку форма зміщувалась у відповідному напрямку на 5 пікселів; 
5. Заголовок форми також повинен відображати напрямок кнопки на яку ви натиснули.

Завдання 4.

1. Створіть новий проект;
2. Встановіть ширину форми 400 пікселів;
3. Додайте до форми 5 кнопок;
4. задайте 4-м кнопкам ширину 50 пікселів;
5. Створіть обробник події для однієї з кнопок, щоб при кліку по ній решта кнопок розташувались по куткам форми.

Вдалося? А тепер не закриваючи програми, мишкою змініть ширину та висоту вікна і знову натисніть "По куткам". Кнопки правильно розташувалися? Тоді Ви на правильному шляху.

Якщо потрібна буде підказка, напишіть про це в коментарях.