Відображення рисунків із зовнішніх файлів

Увага! Під час роботи з комп'ютером дотримуйтеся правил безпеки і санітарно-гігієнічних норм.

Види навчальної діяльності

Обговорюємо

1. Як у проектах, розроблених у середовищі програмування Lazarus, розміщують графічні зображення на формі? Яке їх призначення?
2. Які засоби передбачені в середовищі програмування Lazarus, щоб додані на форму малюнки не спотворювались, збільшувались, імітували рух?

Діємо разом

• Вправа 1. У середовищі програмування Lazarus створіть проект, форма якого містить малюнок, що збережений у файлі ozon.png. При натисненні кнопки Збільшити розміри малюнка збільшується (імітується ефект наближення). 

1. Завантажте середовище Lazarus і створіть новий проект. 
2. Змініть значення властивостей об'єкта Form1, розмістіть на формі об'єкти, як на зразку, та надайте значень їх властивостям:
   
3. Для додавання на форму зображення скористайтеся компонентом Image:
   
4. У вікні Інспектора об'єктів встановіть властивості для зображення:
   

   

   1 - виберіть об'єкт Image1,  2 (AutoSize) - автоматична зміна розміру компонента до реального розміру зображення, 3 (Hint) - текст вспливаючої підказки, коли курсор над об'єктом, 4 (Picture) - завантаження зображення, 5 (ShowHint) - показувати чи не показувати текстову підказку, 6 (Stretch) - автоматичне масштабування (стиснення чи розтягнення). 
5. Створіть процедуру опрацювання події натиснення кнопки Збільшити і введіть команди у вікні редактора коду для переміщення малюнка та збільшення його:

   procedure TForm1.Button1Click(Sender: TObject);
   begin
     Image1.Top := Image1.Top + 100;
     Image1.Left := Image1.Left + 100;
     Image1.Height := Image1.Height + 100;
     Image1.Width := Image1.Width + 100;
   end;

6. Запустіть проект на виконання. Перевірте, чи отримали ви потрібний результат.
7. Завершіть роботу з проектом і середовищем програмування.

• Вправа 2. У середовищі програмування Lazarus створіть проект Полюси магнітів, який містить два малюнки магнітів, розташовані один напроти другого. Потрібні зображення збережені у файлах magnit1.png, magnit2.png. Коли натиснути мишею на лівому малюнку, вони обидва наближаються один до одного, а на правому – віддаляються.

1. Завантажте середовище Lazarus і створіть новий проект.
2. Змініть значення властивостей об'єкта Form1, розмістіть на формі об'єкти, як на зразку, та надайте значень їх властивостям:
   
3. Створіть процедуру опрацювання події натиснули кнопкою миші. Для цього оберіть у вікні Інспектора об'єктів компонент Іmage1, на вкладці Події двічі натисніть у клітинці праворуч (...) від OnMouseDown 
   
   і введіть команди у вікні редактора коду для переміщення малюнка:

procedure TForm1.Image1MouseDown(Sender: TObject; Button: TMouseButton;
  Shift: TShiftState; X, Y: Integer);
begin
  Image1.Left := Image1.Left + 10;
  Image2.Left := Image2.Left - 10
end; 

4. Виконайте аналогічні дії для компонента Image2, врахувавши зміни у програмному коді. 
5. Запустіть проект на виконання. Перевірте, чи отримали ви потрібний результат.
6. Завершіть роботу з проектом і середовищем програмування.

Працюємо в парах

• Поміркуйте, як скласти таблицю узагальнення щодо роботи із графічними об'єктами в середовищі програмування Lazarus. Складіть її засобами текстового процесора. Доповнюйте таблицю новими відомостями.

Виконуємо самостійно

• Завдання. Створіть проект Площа фігур, вікно якого містить зображення трикутника, прямокутника й круга (створити в графічному редакторі), та опрацьовуються такі події: при наведенні вказівника миші на кожну фігуру та утримання натиснутою її лівої кнопки миші на екранній формі в написі виводиться формула площі відповідної фігури; якщо кнопку відпустити, формула зникне. Розгляньте зразок виконаного проекту
  
  і проаналізуйте програмний код для опрацювання подій першого зображення (трикутника):

  procedure TForm1.Image1MouseDown(Sender: TObject; Button: TMouseButton;
    Shift: TShiftState; X, Y: Integer);
  begin
    Label1.Caption := 'S = sqrt(p*(p-a))*(p-b)*(p-c)';
  end;
  
  procedure TForm1.Image1MouseUp(Sender: TObject; Button: TMouseButton;
    Shift: TShiftState; X, Y: Integer);
  begin
    Label1.Caption := 'Формула площі';
  end;    

  Напишіть програмний код для обробки подій для інших зображень (прямокутника і круга), при виконанні завдання для компонентів Image змінюйте значення таких властивостей:
  

Домашнє завдання

• Опрацювати підручник: §27 с. 181-183