Работа с холстом Canvas в библиотеке tkinter

Раздел: Библиотеки -> Графический интерфейс

Холст Canvas в tkinter: основы и варианты использования

Canvas (холст) - это виджет библиотеки tkinter, предназначенный для рисования двухмерной графики, размещения изображений и обработки пользовательского ввода. Основное применение - создание графических редакторов, игр, визуализаций данных и интерактивных элементов интерфейса.

Создание холста происходит через конструктор Canvas(parent, width, height, bg, ...). После создания холст упаковывается в окно методами pack(), grid() или place().


import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=300, bg='white')
canvas.pack()
root.mainloop()

открыть окно python (открыть окно на python)

Холст поддерживает рисование примитивов: линий, прямоугольников, овалов, дуг, многоугольников, текста. Каждый графический объект создаётся соответствующим методом холста (create_line, create_rectangle, create_oval и т.д.) и возвращает уникальный идентификатор (item ID).


canvas.create_line(10, 10, 200, 100, fill='blue', width=3)
canvas.create_rectangle(50, 150, 150, 250, outline='red', fill='yellow')
canvas.create_oval(250, 50, 350, 150, fill='green')

Python окно (создание окон в python tkinter)

Варианты решений для типовых задач

Как нарисовать линию со стрелками на концах?

Используется параметр arrow со значениями 'first', 'last' или 'both'. Дополнительно можно задать форму стрелки через arrowshape.


canvas.create_line(20, 20, 200, 100, arrow='both', arrowshape=(8,10,4), width=2)

Python tkinter canvas (холст canvas в tkinter)

Проблема: стрелка может быть слишком большой или маленькой. Решение - подбирать кортеж в arrowshape (первые два числа задают длину и ширину, третье - расстояние от острия до линии).

Как сделать закруглённый прямоугольник?

Прямоугольник с закруглёнными углами рисуется через метод create_rectangle с параметром smooth=True. Однако это даёт сглаживание углов, но не полное скругление. Для точного скругления используют дуги.


canvas.create_rectangle(50, 50, 150, 150, smooth=True, fill='lightblue')

Python tkinter frame (фрейм frame в tkinter)

Ошибка: smooth=True без указания степени сглаживания может давать неожиданные формы. Рекомендуется комбинировать с параметром splinesteps (например, splinesteps=20).

Как разместить изображение на холсте?

Изображение (PhotoImage или PIL Image) загружается и помещается методом create_image. Координаты указывают центр изображения.


from tkinter import PhotoImage

img = PhotoImage(file='picture.png')
canvas.create_image(200, 150, image=img)

Tkinter python ввод (ввод данных в tkinter)

Типичная ошибка: ссылка на объект PhotoImage не сохраняется - изображение не отображается. Необходимо хранить его в переменной, например, как атрибут класса или глобальную переменную.

Как обрабатывать клик мыши по холсту?

К холсту привязываются события: <Button-1> (левая кнопка), <Button-3> (правая), <Motion> (движение). Обработчик получает объект события с координатами x, y.


def on_click(event):
    print(f'Клик по ({event.x},{event.y})')

canvas.bind('<Button-1>', on_click)

Python tkinter виджет (виджеты tkinter)

Проблема: координаты могут быть смещены, если холст свёрнут или есть отступы. Решение - использовать event.x_root и event.y_root или задать точный anchor.

Как создать анимацию движения объекта?

Анимация строится на периодическом изменении координат объекта с помощью canvas.move() или canvas.coords(), вызываемых через after().


ball = canvas.create_oval(10, 10, 50, 50, fill='red')
dx, dy = 2, 2

def animate():
    global dx, dy
    canvas.move(ball, dx, dy)
    # проверка границ
    x1, y1, x2, y2 = canvas.coords(ball)
    if x2 > 400 or x1 < 0: dx = -dx
    if y2 > 300 or y1 < 0: dy = -dy
    canvas.after(10, animate)

animate()

Python file select (диалог выбора файла в python (tkinter.filedialog))

Ошибка: анимация может тормозить из-за частых вызовов after. Решение - увеличить интервал (например 20-30 мс).

Как очистить холст или удалить объект?

Для удаления всех объектов используется canvas.delete('all'). Для удаления конкретного объекта - его ID или тег.


item = canvas.create_rectangle(0,0,50,50)
canvas.delete(item)

Проблема: после удаления объекта его ID становится недействительным - попытка использовать его в других методах вызовет ошибку. Хранить ID следует в переменной.

Цели и случаи использования

Canvas применяется везде, где нужна двумерная графика: построение графиков функций, создание простых игр (арканоид, змейка), рисование схем, интерактивные образовательные приложения. Каждый вариант решает конкретную задачу: рисование, обработка событий, анимация, работа с изображениями.

- Python tkinter код (примеры кода tkinter)
- Python tkinter image (работа с изображениями в tkinter)
- Python tkinter текст (текстовые элементы в tkinter)

Расширенные примеры работы с Canvas

Пример 1: Рисование графика функции

Построим синусоиду. Координаты масштабируем относительно размеров холста.

Пример 

import math, tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=500, height=300, bg='white')
canvas.pack()

# оси
canvas.create_line(50, 150, 450, 150, arrow='last')
canvas.create_line(50, 250, 50, 50, arrow='last')

# график
points = []
for x in range(0, 400):
    # отображение x от 0 до 4π
    fx = 0.01 * x  # масштаб
    y = 150 - 100 * math.sin(fx)
    points.append((x+50, y))

canvas.create_line(points, fill='blue', smooth=True)
root.mainloop()

(результат: окно с синусоидой и осями)

Пример 2: Интерактивный рисовальщик

Пользователь рисует линии, удерживая левую кнопку мыши.

Пример 

import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=600, height=400, bg='white')
canvas.pack()

last = [None, None]

def start_draw(event):
    last[0] = event.x
    last[1] = event.y

def draw(event):
    if last[0] is not None:
        canvas.create_line(last[0], last[1], event.x, event.y, width=2)
        last[0] = event.x
        last[1] = event.y

def stop_draw(event):
    last[0] = None
    last[1] = None

canvas.bind('<Button-1>', start_draw)
canvas.bind('<B1-Motion>', draw)
canvas.bind('<ButtonRelease-1>', stop_draw)
root.mainloop()

(результат: окно, в котором можно рисовать линии)

Пример 3: Использование тегов для группировки объектов

Теги позволяют обращаться сразу к группе объектов (например, изменить цвет всех объектов одного типа).

Пример 

import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=300, height=200, bg='white')
canvas.pack()

# создаём объекты с тегами
canvas.create_oval(20, 20, 80, 80, fill='red', tags=('circle', 'shape'))
canvas.create_rectangle(120, 20, 180, 80, fill='blue', tags=('rect', 'shape'))
canvas.create_rectangle(220, 20, 280, 80, fill='green', tags=('rect', 'shape'))

# изменить цвет всех прямоугольников
canvas.itemconfig('rect', fill='yellow')
# удалить все круги
canvas.delete('circle')
root.mainloop()

(результат: два прямоугольника жёлтого цвета, круг исчез)

Пример 4: Анимация движения нескольких объектов

Создадим три шара разного цвета, движущихся с разными скоростями.

Пример 

import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=500, height=300, bg='black')
canvas.pack()

balls = []
colors = ['white', 'red', 'blue']
for i, col in enumerate(colors):
    y = 50 + i * 80
    ball = canvas.create_oval(10, y, 50, y+40, fill=col)
    balls.append({'id': ball, 'dx': 1+i, 'dy': 0})

def move_balls():
    for b in balls:
        canvas.move(b['id'], b['dx'], b['dy'])
        x1, _, x2, _ = canvas.coords(b['id'])
        if x2 > 500 or x1 < 0:
            b['dx'] = -b['dx']
    root.after(15, move_balls)

move_balls()
root.mainloop()

(результат: три шара движутся горизонтально, отражаясь от стенок)

Холст Canvas в tkinter - comments

En
Python tkinter canvas (python)