Рисование мышью в Python: Tkinter Canvas и события

Что будет делать программа

Canvas — виджет Tkinter для графических объектов. Построим небольшую рисовалку: нажатие запоминает точку, движение с удерживаемой кнопкой создаёт отрезки, отпускание завершает штрих. Кнопка очищает холст. Это пример событийной программы: код реагирует на действия пользователя, а не заранее знает все координаты.

Проверьте наличие Tkinter командой python -m tkinter в подходящей графической среде. На сервере без дисплея окно не появится. В разных системах команда Python может называться python3; пример использует стандартный модуль tkinter для Python3.

Полный учебный код

import tkinter as tk

root = tk.Tk()
root.title("Draw lines")
canvas = tk.Canvas(root, width=400, height=240, bg="white")
canvas.pack()
previous = None


def start(event):
    global previous
    previous = (event.x, event.y)


def draw(event):
    global previous
    if previous is not None:
        canvas.create_line(
            previous[0], previous[1], event.x, event.y,
            fill="navy", width=2
        )
    previous = (event.x, event.y)


def finish(event=None):
    global previous
    previous = None


def clear():
    canvas.delete("all")
    finish()


canvas.bind("<Button-1>", start)
canvas.bind("<B1-Motion>", draw)
canvas.bind("<ButtonRelease-1>", finish)
tk.Button(root, text="Clear", command=clear).pack()
root.mainloop()

Как устроено состояние

Previous хранит предыдущую точку текущего штриха или None. Обработчик start получает объект события с координатами event.x и event.y. Draw создаёт отрезок от сохранённой точки к новой и обязательно обновляет previous. Finish сбрасывает состояние: следующий штрих не должен соединяться с предыдущим через весь холст.

В command передаётся функция clear без круглых скобок. Запись command=clear() вызвала бы очистку сразу при создании кнопки вместо назначения действия на будущее. Root.mainloop запускает цикл обработки событий.

Разобранная трассировка

Пользователь нажал в (10, 20), переместил мышь в (40, 30), затем в (70, 50). Первый отрезок соединяет (10, 20) и (40, 30), второй — (40, 30) и (70, 50). Если не обновлять previous, оба отрезка начнутся в исходной точке и вместо непрерывного штриха получится веер.

Координаты Canvas отсчитываются от верхнего левого угла: x увеличивается вправо, y — вниз. Это отличается от привычного школьного графика с направлением y вверх. Очищается содержимое холста, а не само окно и не обработчики событий.

Задания

1. Какая точка станет previous после второго движения из примера?
2. Что произойдёт при замене command=clear на command=clear()?
3. Как изменить толщину штриха и почему это не меняет координаты событий?

Ответы

1. (70, 50), до отпускания кнопки; затем finish установит None. 2. Функция выполнится при создании кнопки, а её результат будет использован вместо ожидаемого обработчика. 3. Измените параметр width у create_line. Он управляет видом объекта, а event.x/y описывают положение указателя.

Проверка программы

Нарисуйте два раздельных штриха и убедитесь, что между ними нет перемычки. Затем очистите и начните новый штрих. Эти сценарии проверяют логику состояния, а не только способность открыть окно. Сохранение рисунка в файл — отдельная функция, которой в этом примере пока нет.

Связанные материалы

• Основы программирования на Python
• Что такое графический интерфейс пользователя
• Графическая информация и компьютерная графика

Источники и материалы

• Python Documentation: Tkinter, Canvas, привязки событий и callbacks