Учебник Python 3

Tkinter. Содержание котенка (часть 1 - front-end)

Данный проект создадим с использованием grid и ttk виджетов.

Для дальнейшего переиспользования кода, создайте новый файл с названием app_cat_calculator.py.

Планирование проекта

Первое с чего начинается новый проект, после идеи, это план реализации:

  1. выберем технологии реализации grid и ttk
  2. окно имеет вид таблицы: шапка + тело таблицы
  3. «шапка»: таблицы имеет вид: товар - количество - количество дней - цена за ед. - общая цена
  4. «строка»: таблицы имеет вид: товар - количество - количество дней - цена за ед. - общая цена
  5. «подвал»: таблицы имеет вид: общие затраты в год - количество лет - всего затраты

Примерный вид программы можно набросать в табличном редакторе:

01_cat_app

Визуально создадим окно подобное следующему:

02_cat_app

К начальному проекту добавили кнопки, при нажатии на которые будет производиться подсчет.

Создание интерфейса

Создадим окно с использованием ttk элементов:

from tkinter import *
from tkinter.ttk import *

root = Tk()
root.title('Calculator for cat')
root.mainloop()
1
2
3
4
5
6

Для создания подписей колонок используем метку - Label() с соответствующими параметрами и разместим их используя метод - grid():

Label(text="Товар").grid(column=0, row=0)
1

Объявлять переменную и присваивать ей значение:

label = Label(...)
1

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

Создав верхний ряд окна из меток получим следующий вид:

03_cat_app

Второй ряд окна состоит из 5 однострочных полей для ввода данных и кнопки для подсчета. Для визуальной отрисовки виджетов можно воспользоваться следующими строчками кода, копируя и внося в них необходимые изменения:

entry_11 = Entry()
entry_11.grid(column=0, row=1)
button_1 = Button(text="=")
button_1.grid(column=4, row=1)
1
2
3
4

Для удобства цифры в именах переменных означают их позицию: entry_11, где "1" строчка и "1" столбец, и номера позиции поля ввода позволяют не запутаться. Кнопка одна, поэтому для неё указывается только номер строки. После добавления второго ряда виджетов должен получиться следующий вид окна:

04_cat_app

Для добавления ещё дух строчек повторим предыдущих шаг, внося необходимые изменения в код для получения следующего вида окна:

05_cat_app

При желании можно добавить и более количество строк.

Далее добавим строки итогового подсчета сначала «Всего затраты за год», которая состоит из метки, кнопки и однострочного текстового поля:

Label(text="Всего затраты за год", justify=RIGHT).grid(column=0, row=4, columnspan=4)
button_6 = Button(text="=")
button_6.grid(column=4, row=4)
entry_for_year = Entry()
entry_for_year.grid(column=5, row=4)
1
2
3
4
5

Результат выполнения:

06_cat_app

В следующей строке «Количество лет» нам не потребуется кнопка, поэтому мы добавим только метку и текстовое поле. Последняя строчка интерфейса будет состоять из метки, кнопки «Итог» и текстового поля для вывода результата.

Воспользовавшись предыдущими примерами кода и внеся необходимые изменения, должно получиться финальное окно:

07_cat_app