Поділіться своєю думкою про онлайн уроки інформатики. Пройдіть анонімне опитування на головній сторінці сайту
Доброго дня, діти! Сьогоднішня тема нашого уроку — "Створення графічних зображень на вікні". Ви, напевно, вже бачили, як комп'ютер може малювати лінії, прямокутники, кола чи навіть складні зображення. Але чи замислювалися ви, як це працює? Сьогодні ми відкриємо завісу і дізнаємося, як програмно створювати графічні зображення, використовуючи мови програмування Python та Lazarus.
Графічні зображення є невід'ємною частиною нашого цифрового світу. Вони використовуються в іграх, додатках, веб-сайтах і навіть у наукових дослідженнях для візуалізації даних. Вміння працювати з графікою корисне не лише для програмістів, а й для дизайнерів, інженерів та вчених. Наприклад, графічні інтерфейси забезпечують зручність роботи з програмами, а візуалізація даних допомагає краще зрозуміти складні процеси.
Графічне вікно — це область програми, де можна створювати та відображати зображення. У Python ми використовуємо бібліотеки, такі як Tkinter, а в Lazarus — елементи TPaintBox для малювання.
Координатна система — графічне вікно працює з двовимірною системою координат. Координати точки задаються значеннями X (по горизонталі) та Y (по вертикалі). Початок координат (0, 0) знаходиться у верхньому лівому куті.
Графічні примітиви — це базові елементи малювання:
Лінії: малюються між двома точками.
Прямокутники: визначаються координатами двох протилежних кутів.
Кола та овали: задаються координатами прямокутника, в який вони вписані.
Кольори: кольори вказуються у вигляді назв (red, blue, green) або спеціальних кодів (наприклад, у форматі RGB).
Python: Малювання графічних примітивів
Для малювання у Python ми використовуємо бібліотеку Tkinter. Розглянемо приклад створення прямокутника, кола та лінії.
python
Копіювати код
import tkinter as tk
# Функція для малювання
def draw_shapes():
canvas.create_rectangle(50, 50, 150, 100, outline="blue", width=2) # Прямокутник
canvas.create_oval(60, 60, 140, 140, outline="red", width=2) # Коло
canvas.create_line(20, 20, 180, 180, fill="green", width=2) # Лінія
# Створення вікна
window = tk.Tk()
window.title("Графіка у Python")
canvas = tk.Canvas(window, width=200, height=200, bg="white")
canvas.pack()
button = tk.Button(window, text="Малювати", command=draw_shapes)
button.pack()
window.mainloop()
Lazarus: Малювання графічних примітивів
У Lazarus малювання відбувається на спеціальному елементі форми TPaintBox.
Додайте на форму елемент TPaintBox і кнопку TButton.
Напишіть код у події кнопки:
pascal
Копіювати код
procedure TForm1.Button1Click(Sender: TObject);
begin
with PaintBox1.Canvas do
begin
Brush.Color := clWhite; // Очищення області
FillRect(PaintBox1.ClientRect);
Pen.Color := clBlue; // Колір ліній
Pen.Width := 2;
Rectangle(50, 50, 150, 100); // Прямокутник
Pen.Color := clRed;
Ellipse(60, 60, 140, 140); // Коло
Pen.Color := clGreen;
MoveTo(20, 20);
LineTo(180, 180); // Лінія
end;
end;
Малювання будинку: Намалюйте будиночок, що складається з прямокутника (основи будинку) та трикутника (даху).
Сонце: Намалюйте круг із променями, що відходять у різні боки.
Дерево: Намалюйте коло (крона дерева) і прямокутник (стовбур).
Ці завдання допоможуть закріпити ваші знання та навчать використовувати графічні примітиви для створення складніших малюнків.
Сьогодні ми познайомилися з основами створення графіки в програмах, дізналися про координатну систему, графічні примітиви та кольори. У наступних уроках ми розглянемо, як створювати анімацію та працювати з користувацькими графічними елементами. Тепер ви знаєте, як програмно малювати в Python і Lazarus, що відкриває перед вами можливості для реалізації креативних ідей!
Умова: Намалювати сонце у вигляді круга з променями, що виходять у різні сторони.
Розв'язок у Python
python
Копіювати код
import tkinter as tk
# Функція для малювання сонця
def draw_sun():
canvas.create_oval(80, 80, 120, 120, outline="orange", fill="yellow", width=2) # Сонце (круг)
for i in range(0, 360, 30): # Промені
x1 = 100 + 40 * cos(radians(i))
y1 = 100 - 40 * sin(radians(i))
x2 = 100 + 60 * cos(radians(i))
y2 = 100 - 60 * sin(radians(i))
canvas.create_line(x1, y1, x2, y2, fill="orange", width=2)
from math import sin, cos, radians
window = tk.Tk()
window.title("Сонце")
canvas = tk.Canvas(window, width=200, height=200, bg="white")
canvas.pack()
button = tk.Button(window, text="Малювати сонце", command=draw_sun)
button.pack()
window.mainloop()
Розв'язок у Lazarus
Алгоритм створення проєкту:
Додати на форму елемент TPaintBox.
Додати кнопку TButton із підписом "Малювати сонце".
Додати обробник події OnClick кнопки.
pascal
Копіювати код
uses Math;
procedure TForm1.Button1Click(Sender: TObject);
var
i: Integer;
x1, y1, x2, y2: Integer;
begin
with PaintBox1.Canvas do
begin
Brush.Color := clYellow;
Pen.Color := clOrange;
Ellipse(80, 80, 120, 120); // Сонце (круг)
for i := 0 to 11 do
begin
x1 := 100 + Round(40 * Cos(i * Pi / 6));
y1 := 100 - Round(40 * Sin(i * Pi / 6));
x2 := 100 + Round(60 * Cos(i * Pi / 6));
y2 := 100 - Round(60 * Sin(i * Pi / 6));
MoveTo(x1, y1);
LineTo(x2, y2); // Промені
end;
end;
end;
Умова: Намалювати будинок із прямокутника (основа) та трикутника (дах).
Розв'язок у Python
python
Копіювати код
import tkinter as tk
# Функція для малювання будинку
def draw_house():
canvas.create_rectangle(50, 100, 150, 180, fill="blue") # Основа
canvas.create_polygon(50, 100, 150, 100, 100, 60, fill="red") # Дах
window = tk.Tk()
window.title("Будинок")
canvas = tk.Canvas(window, width=200, height=200, bg="white")
canvas.pack()
button = tk.Button(window, text="Малювати будинок", command=draw_house)
button.pack()
window.mainloop()
Розв'язок у Lazarus
Алгоритм створення проєкту:
Додати на форму TPaintBox.
Додати кнопку TButton із підписом "Малювати будинок".
Додати обробник події OnClick кнопки.
pascal
Копіювати код
procedure TForm1.Button1Click(Sender: TObject);
begin
with PaintBox1.Canvas do
begin
Brush.Color := clBlue;
Pen.Color := clBlack;
Rectangle(50, 100, 150, 180); // Основа
Brush.Color := clRed;
Polygon([Point(50, 100), Point(150, 100), Point(100, 60)]); // Дах
end;
end;
Умова: Намалювати дерево із прямокутника (стовбур) та круга (крона).
Розв'язок у Python
python
Копіювати код
import tkinter as tk
# Функція для малювання дерева
def draw_tree():
canvas.create_rectangle(90, 120, 110, 180, fill="brown") # Стовбур
canvas.create_oval(60, 80, 140, 120, fill="green") # Крона
window = tk.Tk()
window.title("Дерево")
canvas = tk.Canvas(window, width=200, height=200, bg="white")
canvas.pack()
button = tk.Button(window, text="Малювати дерево", command=draw_tree)
button.pack()
window.mainloop()
Розв'язок у Lazarus
Алгоритм створення проєкту:
Додати на форму TPaintBox.
Додати кнопку TButton із підписом "Малювати дерево".
Додати обробник події OnClick кнопки.
pascal
Копіювати код
procedure TForm1.Button1Click(Sender: TObject);
begin
with PaintBox1.Canvas do
begin
Brush.Color := clBrown;
Rectangle(90, 120, 110, 180); // Стовбур
Brush.Color := clGreen;
Ellipse(60, 80, 140, 120); // Крона
end;
end;
Ці задачі допоможуть учням закріпити навички роботи з графічними примітивами та навчать створювати прості графічні зображення у Python і Lazarus.
Оберіть одну правильну відповідь з запропонованих варіантів.
Яка з наведених бібліотек Python найчастіше використовується для створення графічного інтерфейсу?
А. NumPy
Б. Pandas
В. Tkinter
Г. Matplotlib
Правильна відповідь: В.
Який метод використовується для створення основного вікна в Tkinter?
А. create_window()
Б. Tk()
В. window()
Г. mainloop()
Правильна відповідь: Б.
Який метод використовується для створення кнопки в Tkinter?
А. create_button()
Б. Button()
В. make_button()
Г. add_button()
Правильна відповідь: Б.
Яка з наведених функцій використовується для відображення вікна на екрані?
А. show()
Б. display()
В. mainloop()
Г. run()
Правильна відповідь: В.
Який атрибут використовується для встановлення заголовка вікна в Tkinter?
А. title
Б. name
В. caption
Г. header
Правильна відповідь: А.
Питання з відповідями
1. Що таке графічний примітив у програмуванні?
a) Складна програма
b) Проста графічна форма (коло, лінія)
c) Кілька елементів, з'єднаних разом
Правильна відповідь: b
2. Яка команда в Python використовується для створення кола?
a) create_rectangle
b) create_line
c) create_oval
Правильна відповідь: c
3. У Lazarus для малювання кола використовується команда:
a) Ellipse
b) Rectangle
c) Polygon
Правильна відповідь: a
4. Як називається об'єкт у Python для роботи з графікою у Tkinter?
a) Button
b) Canvas
c) Frame
Правильна відповідь: b
5. Що таке "точка" в контексті графічних координат?
a) Місце перетину ліній
b) Пара чисел (x, y), які визначають місце на площині
c) Коло
Правильна відповідь: b
6. Який метод у Lazarus дозволяє змінити колір заливки примітивів?
a) Canvas.FillColor
b) Brush.Color
c) Pen.Color
Правильна відповідь: b
7. У Python у модулі Tkinter команда для створення прямокутника це:
a) create_rectangle
b) create_polygon
c) create_square
Правильна відповідь: a
8. Що таке TPaintBox у Lazarus?
a) Інструмент для створення тексту
b) Компонент для графічного виводу
c) Панель для кнопок
Правильна відповідь: b
9. У якому порядку треба вказувати координати для create_line у Tkinter?
a) (x1, y1, x2, y2)
b) (y1, x1, x2, y2)
c) (x1, x2, y1, y2)
Правильна відповідь: a
10. У Lazarus метод Polygon використовується для створення:
a) Кола
b) Лінії
c) Багатокутника
Правильна відповідь: c
11. Який інструмент у Lazarus дозволяє змінити товщину лінії?
a) Brush.Width
b) Pen.Width
c) Canvas.Width
Правильна відповідь: b
12. У Python команда create_polygon використовується для створення:
a) Прямокутників
b) Ліній
c) Багатокутників
Правильна відповідь: c
13. Як у Lazarus вказуються координати для LineTo?
a) Відносно центру
b) Відносно попередньої точки
c) Абсолютно на формі
Правильна відповідь: b
14. Що таке RGB у контексті графіки?
a) Команда для створення кола
b) Система, що визначає колір через червоний, зелений і синій компоненти
c) Формат для створення текстових файлів
Правильна відповідь: b
15. У Python для задання кольору використовується:
a) HEX-код або назва кольору
b) Лише RGB
c) Тільки чорно-біле представлення
Правильна відповідь: a
16. У Lazarus команда MoveTo використовується для:
a) Створення нового об'єкта
b) Переміщення "пера" без малювання лінії
c) Видалення елементів
Правильна відповідь: b
17. Який тип координат використовується у Tkinter?
a) Декартові
b) Полярні
c) Тривимірні
Правильна відповідь: a
18. Що таке Brush у Lazarus?
a) Інструмент для ліній
b) Інструмент для заливки кольором
c) Інструмент для очищення полотна
Правильна відповідь: b
19. У Python, щоб очистити Canvas, можна використати метод:
a) delete("all")
b) clear()
c) reset_canvas()
Правильна відповідь: a
20. У Lazarus для виведення тексту на формі використовується команда:
a) DrawText
b) Canvas.TextOut
c) Canvas.DrawString
Правильна відповідь: b
21. Як у Tkinter задається колір лінії?
a) Через параметр outline
b) Через параметр fill
c) Через параметр width
Правильна відповідь: a
22. У Lazarus метод Clear використовується для:
a) Очищення всіх графічних об'єктів
b) Переміщення об'єктів
c) Заливки прямокутника
Правильна відповідь: a
23. Що станеться, якщо у Tkinter не вказати координати примітива?
a) Буде створено на позиції (0, 0)
b) Примітив не буде створений
c) Позиція обирається випадково
Правильна відповідь: b
24. Яка одиниця вимірювання використовується для координат у Lazarus?
a) Пікселі
b) Сантиметри
c) Дюйми
Правильна відповідь: a
25. У Python, щоб змінити товщину лінії, використовується параметр:
a) thickness
b) width
c) size
Правильна відповідь: b
26. У Lazarus для зміни шрифту тексту використовується:
a) Canvas.Font.Size
b) Canvas.Pen.Style
c) Canvas.TextFont
Правильна відповідь: a
27. У Python, для створення багатокутника в Tkinter, координати передаються у вигляді:
a) Масиву точок
b) Рядка чисел
c) Кортежу чисел
Правильна відповідь: c
28. У Lazarus, якщо вказати негативні координати, об'єкт буде:
a) Побудовано за межами форми
b) Автоматично переміщено на форму
c) Не буде створено
Правильна відповідь: a
29. Яка основна перевага використання процедур і функцій для малювання графіки?
a) Простота коду і повторне використання
b) Зменшення розміру форми
c) Автоматична зміна кольорів
Правильна відповідь: a
30. У Python, для малювання в модулі turtle команда для зміни кольору це:
a) set_color
b) color
c) change_color
Правильна відповідь: b
До оцінювання за критерієм групи результатів 1 (ГР1):
Підходять питання №: 1, 5, 9, 10, 13, 14, 24, 27.
До оцінювання за критерієм групи результатів 2 (ГР2):
Підходять питання №: 2, 3, 7, 10, 20, 22, 29.
До оцінювання за критерієм групи результатів 3 (ГР3):
Підходять питання №: 4, 8, 16, 19, 21, 28.
До оцінювання за критерієм групи результатів 4 (ГР4):
Підходять питання №: 6, 9, 15, 18, 25, 30.
Примітка:
Деякі питання одночасно відносяться до кількох груп результатів, адже вони оцінюють як розуміння основних термінів, так і практичне вміння їх використовувати.