With canvas do. 11. Запускають прикладну програму і спостерігають за створенням сітки з горизонтальних та вертикальних ліній (рисунок 19).

Begin

moveto(x,0);

lineto(x,height);

moveto(0,y);

lineto(width,y);

y:=y+d;

x:=x+d;

end; end; end;

11. Запускають прикладну програму і спостерігають за створенням сітки з горизонтальних та вертикальних ліній (рисунок 19).

 

Рисунок 19 - відображення вертикальних і горизонтальних ліній у вікні застосунку

12. Встановлюють на форму нову кнопку Button3 і надають її властивості сaption значення < сітка колон >. Подвійним клацанням запрограмовують подію Button3Click, в якій поки що йдеться про відображення тільки однієї колони квадратного перерізу 40х40 пікселів, червоного забарвлення і з координатами своєї верхньої лівої точки – 30,30.

procedure TForm2.Button3Click(Sender: TObject);

var r:TRect; l, t, a: integer;

Begin

a:=40;

l:=30;

t:=30;

r.Left:=l;

r.Top:=t;

r.Right:= l+a;

r.Bottom:= t+a;

canvas.Brush.Color:=clred;

canvas.Rectangle(r);

end;

13. Запускають команду RUN і клацають по цій кнопці. В результаті отримують відображення червоної колони (рисунок 20) на вікні прикладної програми.

Рисунок 20 - відображення однієї колони квадратного перерізу.

14. Доповнюють вище наведений програмний код фрагментами, які зумовлюватимуть появу горизонтального ряду колон. Для цього вводять поняття кроку k між колонами і відразу надають значення цій величині – 100 пікселів. Дооголошують змінну g: array [1..5] of integer, яка уможливлюватиме побудову однорядного масиву із п’яти колон. Завдяки циклу, тіло якого обведене у рамку, отримують зазначений масив – горизонтальний ряд із п’яти квадратних фігур. Свіжо написані кодові рядки спеціально для наочності є у підпрограмі підкреслені.

 

procedure TForm2.Button3Click(Sender: TObject);

var r:TRect; l,t,a, k: integer; g: array [1..5] of integer;

I: Integer;

Begin

k:=100;

a:=40;

l:=30;

t:=30;

for i:= 1 to 5 do begin

r.Left:=l;

r.Top:=t;

r.Right:=l+a;

r.Bottom:=t+a;

canvas.Brush.Color:=clred;

canvas.Rectangle(r);

g[i]:=l+k;

l:=g[i];

end;

end;

15. Запускають команду RUN і клацають по кнопці < сітка колон >. В результаті отримують відображення горизонтального ряду із п’яти червоних квадратів (рисунок 21), які перекривають координатну сітку, оскілька та будується під-час виконання події OnPaint, тобто до події пов’язаної з клацанням по кнопці Button3. Процедурою Button3Click повторно викликають подію OnPaint, тому що в тілі підпрограми є звернення до властивості canvas, а значить відбувається перемальовування і координатної сітки, і сітки колон. В той же час кнопки є об’єктами, а об’єкти завжди візуалізуються чи рухаючись перевізуалізовуються у викликаній події OnPaint,але це відбувається після попередньої візуалізації об’єкта класу TForm.

Рисунок 21 - відображення горизонтального ряду колон квадратного перерізу.

16. Доопрацьовують код процедури Button3Click з метою створення – сітки 5х3 колон. Для цього створюють ще один масив v: array [1..3] of integer і опрацьовують цикл у циклі. Новодолучені фрагменти підпрограми – підкреслені.

procedure TForm2.Button3Click(Sender: TObject);

var r:TRect; l,ri,t,b,a,k: integer; g: array [1..5] of integer;

v: array [1..3] of integer;

I,j: Integer;

Begin

k:=100;

a:=40;

l:=30;

t:=30;

for j:= 1 to 3 do begin

for I:= 1 to 5 do begin

r.Left:=l;

r.Top:=t;

r.Right:=l+a;

r.Bottom:=t+a;

canvas.Brush.Color:=clred;

canvas.Rectangle(r);

end;

g[i]:=l+k;

l:=g[i];

v[j]:=t+k;

t:=v[j];

end;

end;

17. Запускають прикладну програму і зауважують дещо не те, що планувалося (рисунок 21) після клацання по кнопці Button3.

Рисунок 21 - три зміщені по горизонталі ряди колон квадратного перерізу.

Зміщення рядів відбулося за рахунок послідовності операторів g[i]:=l+k; l:=g[i], які вказують на те, що при переході від j=1 до j=2 у циклі for j:= 1 to 3 do величина змінної l вже набула значення l+5k=530 пікселів. Тобто перший квадрат другого ряду має координату х не 30, а 530.

18. Вставляють оператор l:=30; між оператором for j:= 1 to 3 do begin

і оператором for I:= 1 to 5 do begin.

19. Запускають команду RUN. Клацають по кнопці і отримують заплановане розміщення колон квадратного профілю (рисунок 22).

20. Перевіряють можливості «ґумки» (рисунок 23). Як підказує досвід попередніх етапів побудови, «стираються» колони, але залишається незмінною координатна сітка. Це звичайний візуальний обман, оскільки як щодо координатної сітки у місцях дотику з < ґумкою >, так і щодо власне < ґумки >, яка рухається відбувається їх перемальовування, а значить виклик події OnPaint. Сітка ж колон перемальовується тільки при зверненні до події повязаної із клацанням по кнопці Button3.

Рисунок 22 - сітка колон квадратного перерізу.

Рисунок 23 - процес «стирання» сітки колон.

З Зразок створення застосунку

«Автоматизація проектування графічного плану виробничого приміщення»

Частина 3.

Створення та розміщення на виробничій площі графічних проекцій нерухомого обладнання і обмежувальних ліній:

1. Відкривають вікно коду нового модуля File > New > Unit і зберігають його під запланованим іменем, наприклад: Equipments.

2. В розділі interface задекларовують процедуру figura1_show (sender:TObject), яка б мала слугувати графічному відтворенню певної геометричної двовимірної побудови на тлі форми, ім’я якої визначатиметься згодом, тобто під-час використання цієї підпрограми, як вкладеної в тіло деякої певної процедури – що відтворюватиме конкретну подію.

unit Equipments;