У мові Python існують різні способи роботи з графікою. Тобі відомі засоби модуля tkinter для створення графічного інтерфейсу — створення графічного вікна, розміщення у вікні графічних компонентів та програмування обробки подій для цих компонентів. Засобами tkinter можна створювати зображення та анімацію.
Створення вікна програми з написом і кнопкою
Згадаємо основні кроки зі створення програми з графічним інтерфейсом. Побудова програми починається зі створення вікна. У вікно додаються всі інші потрібні компоненти графічного інтерфейсу.
Проаналізуємо програмний код створення вікна з написом і кнопкою.
1. from tkinter import * # завантаження модуля tkinter
2. def btn_click(): # Опис функції-обробника події "натискання на кнопку"
3. lab.config(text = 'Успіхів!')
4. root = Tk()
5. root.title ('Графічна програма')
6. root.geometry('250x150')
7. lab = Label(root, text = 'Помалюємо?', font = 'Arial 14')
8. lab.place(x = 100, y = 1)
9. btn = Button(root, text = 'Так', command = btn_click)
10. btn.place(x = 50, y = 50)
11. root.mainloop() # запуск головного циклу обробки подій
У 4-му рядку створюється змінна root, у якій зберігається об’єкт класу Tk(), який визначений у модулі tkinter.
Об’єкт root створює порожнє вікно, до якого можна додавати кнопки, текстові поля, холсти для малювання та інші віджети. Це основний клас модуля tkinter.
У 7-му рядку створюється об'єкт lab класу Label, який розміщено у вікні методом lab.place(x = 100, y = 1).
У 9-му рядку створено кнопку — об’єкт класу Button. При створенні об’єкта btn першим аргументом указано змінну root (батьківський віджет), другим — 'Так' (заголовок кнопки), третім — посилання на метод btn_click, який буде виконуватися в разі натискання на кнопку.
Якщо зберегти й виконати цей код, побачимо вікно програми (рис. 1).
При виконанні програми після натискання на кнопку заголовок напису зміниться на текст 'Успіхів!'.
Рис.1
Полотно для малювання
У tkinter зображення створюється в межах полотна — об’єкту класу Canvas. Тому перш, ніж записувати команди для малювання, потрібно створити полотно.
Синтаксис створення об’єкта класу Canvas:
змінна = Canvas (батьківський_віджет, width=значення, height=значення)
змінна = Canvas (батьківський_віджет, width=значення, height=значення)
Приклад:
Створити полотно розміром 500х500 пікселів.
from tkinter import *
root = Tk()
canvas = Canvas(root, width=500, height=500)
canvas.pack()
from tkinter import *
root = Tk()
canvas = Canvas(root, width=500, height=500)
canvas.pack()
Для малювання ліній на полотні використовують координати.
Будь-яка точка на полотні може бути задана парою чисел (X, Y), де Х — це відстань від точки до лівого краю полотна, Y — відстань від точки до верхнього краю полотна.
Рис.2
Полотно на рис.2 має ширину 500 пікселів і висоту 500 пікселів, тобто верхньому лівому куту відповідають координати (0, 0), а правому нижньому — (500, 500).
Колір полотна — світло-сірий, за бажання можна змінити фон для майбутнього малюнка за допомогою команди
canvas.config(bg = 'blue') #blue замініть назвою потрібного кольору
Методи полотна tkinter
Об’єкт Canvas має ряд методів, призначених для малювання точок, ліній, прямокутників, кіл, дуг, виведення тексту.
Відрізок. Метод create_line креслить відрізок від точки з координатами (x1, y1) до точки(x2, y2):
canvas.create_line(x1, y1, x2, y2)
canvas.create_line(x1, y1, x2, y2)
Приклад:
Намалювати лінію від верхнього лівого кута полотна до правого нижнього кута.
canvas.create_line(0, 0, 500, 500)
canvas.create_line(0, 0, 500, 500)
Прямокутник. Метод create_rectangle малює незаповнений прямокутник, протилежні кути якого збігаються з точками (x1, y1) і (x2, y2). Сторони прямокутника паралельні сторонам екрана:
canvas.create_rectangle (x1, y1, x2, y2)
canvas.create_rectangle (x1, y1, x2, y2)
Приклад:
Намалювати квадрат із довжиною сторони 100 пікселів:
canvas.create_rectangle (20,30,120,130)
Еліпс. Метод canvas.create_oval малює еліпс, вписаний в прямокутник, який задано координатами двох протилежних вершин x1, y1 і x2, y2 (рис.3):
canvas.create_oval (x1, y1, x2, y2)
Рис.3
Приклад:
Намалювати коло діаметром 100 пікселів.
canvas.create_oval (20, 30, 120, 130);
canvas.create_oval (20, 30, 120, 130, fill='red', outline='blue', width=3)
canvas.create_oval (20, 30, 120, 130);
canvas.create_oval (20, 30, 120, 130, fill='red', outline='blue', width=3)
Багатокутник. Багатокутник — це фігура, що має три і більше вершин і замкнений контур. Щоб накреслити багатокутник, потрібно указати координати всіх його вершин (рис.4):
canvas.create_polygon(х1,у1, х2, у2, …, xn, yn)
canvas.create_polygon(х1,у1, х2, у2, …, xn, yn)
За замовчуванням багатокутник зафарбовується чорним кольором. Якщо потрібно зобразити незафарбований багатокутник, потрібно додати параметри fill="" (надати параметру «заливка» порожнє значення) та outline="black" (задати чорний колір контуру).
Рис.4
Приклад:
Накреслити незафабований трикутник.
points = [10, 10, 100, 10, 100, 110]
canvas.create_polygon(points, fill="", outline="black")
points = [10, 10, 100, 10, 100, 110]
canvas.create_polygon(points, fill="", outline="black")
Дуга. Дуга — це сегмент кола. Для малювання дуги треба викликати метод create_arc, передавши йому координати вершин прямокутника, до якого вписаний еліпс, частиною якого є дуга (рис.5). Синтаксис виклику:
canvas.create_arc(х1,у1, х2, у2, start, extent, style)
де х1,у1, х2, у2 - координати вершин прямокутника; start – кут, з якого починається дуга; extent – кут розвертання дуги в градусах; style – стиль дуги.
canvas.create_arc(х1,у1, х2, у2, start, extent, style)
де х1,у1, х2, у2 - координати вершин прямокутника; start – кут, з якого починається дуга; extent – кут розвертання дуги в градусах; style – стиль дуги.
Рис.5
Зверни увагу!
Відлік кутів ведеться проти годинникової стрілки. На рис.5 зображено дві дуги, для першої параметр extent = 90, для другої – extent = 270.
Приклад:
Намалювати іншопланетянина (рис.6).
from tkinter import *
root = Tk()
canvas = Canvas(root, width=200, height=200)
canvas.pack()
canvas.create_oval (10, 10, 110, 110) #обличчя
canvas.create_oval (20, 30, 40, 80, fill="black") #ліве око
canvas.create_oval (80, 30, 100, 80,fill="black") #праве око
canvas.create_rectangle(50,110, 70, 160) #тулуб
canvas.create_line(50, 160, 40,180) #ліва кінцівка
canvas.create_line(70, 160, 80,180) #права кінцівка
canvas.create_arc(40,70,80,100,start=200,extent=160, style=ARC) #посмішка
from tkinter import *
root = Tk()
canvas = Canvas(root, width=200, height=200)
canvas.pack()
canvas.create_oval (10, 10, 110, 110) #обличчя
canvas.create_oval (20, 30, 40, 80, fill="black") #ліве око
canvas.create_oval (80, 30, 100, 80,fill="black") #праве око
canvas.create_rectangle(50,110, 70, 160) #тулуб
canvas.create_line(50, 160, 40,180) #ліва кінцівка
canvas.create_line(70, 160, 80,180) #права кінцівка
canvas.create_arc(40,70,80,100,start=200,extent=160, style=ARC) #посмішка
Рис.6
Створення кольорових зображень
Для створення кольорових малюнків слід до переліку параметрів графічних методів додати параметри fill (колір заливки) і outline (колір лінії). Можна також збільшити товщину лінії, задавши значення параметру width.
def draw_rectangle(width, height, fill_color):
x1 = randint(1,width)
y1 = randint(1,height)
x2 = x1 + randint(1,width)
y2 = y1 + randint(1,height)
canvas.create_rectangle(x1, y1, x2, y2, fill = fill_color)
Приклад:
Намалювати червоне коло з синім контуром довщиною в 3 піксели:
canvas.create_oval (20, 30, 120, 130, fill='red', outline='blue', width=3)
canvas.create_oval (20, 30, 120, 130, fill='red', outline='blue', width=3)
Приклад:
Заповнити полотно випадковими прямокутниками. Для цього підключимо модуль random і створимо функцію draw_rectangle(), яка креслить прямокутник, координатами якого є випадкові числа. Функція draw_rectangle() приймає три аргументи: найбільшу ширину (width), найбільшу висоту (height), колір прямокутника (fill_color).
Координати лівого верхнього кута x1, у1 набувають випадкових значень в діапазонах (0, width) і (0,height).
Координати правого нижнього кута x2, y2 отримуємо додаванням до відповідної координати лівого верхнього кута випадкового числа. Викликаємо метод canvas.create_rectangle (x1, y1, x2, y2), щоб накреслити прямокутник. До переліку параметрів функції create_rectangle додамо параметр fill і присвоїмо цьому параметру значення змінної fill_color. З основної програми в циклі for 30 разів викликаємо функцію draw_rectangle(). Програма заповніть полотно кольоровими прямокутниками (рис.7).
def draw_rectangle(width, height, fill_color):
x1 = randint(1,width)
y1 = randint(1,height)
x2 = x1 + randint(1,width)
y2 = y1 + randint(1,height)
canvas.create_rectangle(x1, y1, x2, y2, fill = fill_color)
c=['red', 'green', 'blue', 'yellow'] #список кольорів
for x in range(0, 30):
draw_rectangle(200, 200, c[x%4])
for x in range(0, 30):
draw_rectangle(200, 200, c[x%4])
Рис.7
Малювання тексту
Метод create_text() використовується для малювання тексту на полотні:canvas.create_text(x, y, text)
За замовчуванням у точці (х, у) розташовується центр текстового напису. Щоб змінити це і, наприклад, розмістити за заданими координатами ліву межу тексту, використовують параметр anchor зі значенням W (від англ. West — захід).
Для оформлення тексту можна використовувати різні параметри форматування — колір тексту (fill), розмір символів і шрифт (font) тощо. Текст на полотні також є графічним об’єктом, тому можна задати кут повороту тексту (параметр angle).
Найчастіше текст на полотні використовують для підписів до геометричних фігур, схем, діаграм тощо.
Потрібно вивести текст на полотно, як наведено на рис. 8.
canvas.create_text(250, 100, text = "Hello World", font = "Arial 30")
canvas.create_text(150, 200, text = "Hello", font = "Arial 25", fill = 'red', angle = 45)
canvas.create_text(300, 200, text = "World", font = "Arial 25", fill = 'green', angle = 120)
Рис.8
Виведення зображень з графічних файлів
Для виведення на полотно зображення з графічного файлу потрібно шлях до графічного файла завантажити до змінної за допомогою функції PhotoImage (file = 'шлях до файла') і викликати метод create_image.
Формат файлів PhotoImage обмежений (підтримуються лише GIF і PNG)
Формат файлів PhotoImage обмежений (підтримуються лише GIF і PNG)
Якщо графічний файл збережено в папку програми, достатньо вказати лише назву файлу.
Приклад:
Вивести на полотно малюнок picture1.gif, який розташований на диску D:
my_image = PhotoImage(file=' d:\\picture1.gif')
canvas.create_image(0, 0, anchor=NW, image=my_image)
my_image = PhotoImage(file=' d:\\picture1.gif')
canvas.create_image(0, 0, anchor=NW, image=my_image)
Джерела:
Інформатика : підруч. для 8 кл. закл. загал. серед. освіти / [О. О. Бондаренко, В. В. Ластовецький, О. П. Пилипчук, Є. А. Шестопалов]. — Харків : Вид-во «Ранок», 2025.