# Frame() — рамка
Для сложных интерфейсов используют отдельные области позиционирования элементов.
Фрейм — вспомогательный виджет, создание которого происходит при помощи класса Frame() .
Фреймы размещают на главном окне, а уже в фреймах – виджеты:
from tkinter import * root = Tk() frame_top = Frame(root) # root можно не указывать frame_top.pack() label_1 = Label(frame_top, width=7, height=4, bg='yellow', text="1") label_1.pack(side=LEFT) label_2 = Label(frame_top, width=7, height=4, bg='orange', text="2") label_2.pack(side=LEFT) frame_bottom = Frame(root) frame_bottom.pack() label_3 = Label(frame_bottom, width=7, height=4, bg='lightgreen', text="3") label_3.pack(side=LEFT) label_4 = Label(frame_bottom, width=7, height=4, bg='lightblue', text="4") label_4.pack(side=LEFT) root.mainloop() Кроме Frame существует похожий класс LabelFrame – фрейм с подписью. В отличие от простого фрейма у него есть свойство text:
from tkinter import * root = Tk() frame_top = LabelFrame(text="Верх") frame_top.pack() label_1 = Label(frame_top, width=7, height=4, bg='yellow', text="1") label_1.pack(side=LEFT) label_2 = Label(frame_top, width=7, height=4, bg='orange', text="2") label_2.pack(side=LEFT) frame_bottom = LabelFrame(text="Низ") frame_bottom.pack() label_3 = Label(frame_bottom, width=7, height=4, bg='lightgreen', text="3") label_3.pack(side=LEFT) label_4 = Label(frame_bottom, width=7, height=4, bg='lightblue', text="4") label_4.pack(side=LEFT) root.mainloop() # Упражнения
- Допишите существующий код, добавив ниже фрэйм «Footer», в котором будут горизонтально находиться две метки с надписями «5», «6».
- Допишите существующий код, добавив на верх фрэйм «Header», в котором будут горизонтально находиться три кнопки с надписями «File», «View», «About». Реализуйте растяжение кнопок по ширине окна.
- Напишите программу с четырьмя кнопками, которые будут расположены в углах окна, и при изменении размера окна.
# Горизонтальное расположение
Как и для обычных виджетов, задавая параметры .pack() можно изменять положения фреймов. внеся изменения в наш код, мы получим левостороннее расположение фреймов:
frame_top.pack(side=LEFT) frame_bottom.pack(side=LEFT) Кроме side у pack() есть другие параметры-свойства. Можно задавать внутренние ( ipadx и ipady ) и внешние ( padx и pady ) отступы:
frame_top.pack(padx=100, pady=50) frame_bottom.pack(ipadx=10, ipady=10) В результате верхний фрейм отступает от всех ближайших элементов на заданное расстояние, область отступа обведена красной рамкой. В нижнем фрейме появились отступы элементов от рамки:
Когда устанавливаются внутренние отступы, то из-за того, что side прибивает виджет к левой границе, справа получаем отступ в 20 пикселей, а слева – ничего. Можно частично решить проблему, заменив внутренние отступы рамки на внешние отступы у меток. Изменим код следующим образом:
frame_bottom.pack() label_3.pack(side=LEFT, padx=10, pady=10) label_4.pack(side=LEFT, padx=10, pady=10) Но тут появляется промежуток между метками. Чтобы его убрать, пришлось бы каждый виджет укладывать в свой собственный фрейм. Отсюда делаем вывод, что упаковщик tkinter удобен только для относительно простых интерфейсов.
# Упражнения
from tkinter import * import time def tick(): # get the current local time from the PC time2 = time.strftime('%H:%M:%S') # if time string has changed, update it clock.config(text=time2) # calls itself every 200 milliseconds to update the time # display as needed could use >200 ms clock.after(200, tick) root = Tk() clock = Label(root, font=('times', 20, 'bold'), bg='green') clock.pack(fill=BOTH, expand=1) tick() root.mainloop() - Напишите программу с часами состоящую из трех рамок:
- рамка «Moscow time» выводит текущее время в виде: «Moscow time: 17:27:37»,
- рамка «Current time» выводит текущее время в виде: «Hour: 17 Minutes: 27 Second: 37»
- рамка «Left time until the new day» выводит сколько часов минут и секунд осталось до нового дня.
- одно-строчного текстового поля,
- метки с отображением знака «+»,
- второго одно-строчного текстового поля,
- кнопкой «=», при нажатии на которую результат вычисления выводиться в третье текстовое поле,
- третьего одно-строчного тестового поля.
- реализуйте растяжение виджетов по ширине в зависимости от ширины окна.
- Добавьте проверку деления на 0. С выводом сообщения об ошибке, в удобное для пользователя место. Консольный вывод сообщения об ошибке исключить.
# Frame() — рамка
Для сложных интерфейсов используют отдельные области позиционирования элементов.
Фрейм — вспомогательный виджет, создание которого происходит при помощи класса Frame() .
Фреймы размещают на главном окне, а уже в фреймах – виджеты:
from tkinter import * root = Tk() frame_top = Frame(root) # root можно не указывать frame_top.pack() label_1 = Label(frame_top, width=7, height=4, bg='yellow', text="1") label_1.pack(side=LEFT) label_2 = Label(frame_top, width=7, height=4, bg='orange', text="2") label_2.pack(side=LEFT) frame_bottom = Frame(root) frame_bottom.pack() label_3 = Label(frame_bottom, width=7, height=4, bg='lightgreen', text="3") label_3.pack(side=LEFT) label_4 = Label(frame_bottom, width=7, height=4, bg='lightblue', text="4") label_4.pack(side=LEFT) root.mainloop() Кроме Frame существует похожий класс LabelFrame – фрейм с подписью. В отличие от простого фрейма у него есть свойство text:
from tkinter import * root = Tk() frame_top = LabelFrame(text="Верх") frame_top.pack() label_1 = Label(frame_top, width=7, height=4, bg='yellow', text="1") label_1.pack(side=LEFT) label_2 = Label(frame_top, width=7, height=4, bg='orange', text="2") label_2.pack(side=LEFT) frame_bottom = LabelFrame(text="Низ") frame_bottom.pack() label_3 = Label(frame_bottom, width=7, height=4, bg='lightgreen', text="3") label_3.pack(side=LEFT) label_4 = Label(frame_bottom, width=7, height=4, bg='lightblue', text="4") label_4.pack(side=LEFT) root.mainloop() # Упражнения
- Допишите существующий код, добавив ниже фрэйм «Footer», в котором будут горизонтально находиться две метки с надписями «5», «6».
- Допишите существующий код, добавив на верх фрэйм «Header», в котором будут горизонтально находиться три кнопки с надписями «File», «View», «About». Реализуйте растяжение кнопок по ширине окна.
- Напишите программу с четырьмя кнопками, которые будут расположены в углах окна, и при изменении размера окна.
# Горизонтальное расположение
Как и для обычных виджетов, задавая параметры .pack() можно изменять положения фреймов. внеся изменения в наш код, мы получим левостороннее расположение фреймов:
frame_top.pack(side=LEFT) frame_bottom.pack(side=LEFT) Кроме side у pack() есть другие параметры-свойства. Можно задавать внутренние ( ipadx и ipady ) и внешние ( padx и pady ) отступы:
frame_top.pack(padx=100, pady=50) frame_bottom.pack(ipadx=10, ipady=10) В результате верхний фрейм отступает от всех ближайших элементов на заданное расстояние, область отступа обведена красной рамкой. В нижнем фрейме появились отступы элементов от рамки:
Когда устанавливаются внутренние отступы, то из-за того, что side прибивает виджет к левой границе, справа получаем отступ в 20 пикселей, а слева – ничего. Можно частично решить проблему, заменив внутренние отступы рамки на внешние отступы у меток. Изменим код следующим образом:
frame_bottom.pack() label_3.pack(side=LEFT, padx=10, pady=10) label_4.pack(side=LEFT, padx=10, pady=10) Но тут появляется промежуток между метками. Чтобы его убрать, пришлось бы каждый виджет укладывать в свой собственный фрейм. Отсюда делаем вывод, что упаковщик tkinter удобен только для относительно простых интерфейсов.
# Упражнения
from tkinter import * import time def tick(): # get the current local time from the PC time2 = time.strftime('%H:%M:%S') # if time string has changed, update it clock.config(text=time2) # calls itself every 200 milliseconds to update the time # display as needed could use >200 ms clock.after(200, tick) root = Tk() clock = Label(root, font=('times', 20, 'bold'), bg='green') clock.pack(fill=BOTH, expand=1) tick() root.mainloop() - Напишите программу с часами состоящую из трех рамок:
- рамка «Moscow time» выводит текущее время в виде: «Moscow time: 17:27:37»,
- рамка «Current time» выводит текущее время в виде: «Hour: 17 Minutes: 27 Second: 37»
- рамка «Left time until the new day» выводит сколько часов минут и секунд осталось до нового дня.
- одно-строчного текстового поля,
- метки с отображением знака «+»,
- второго одно-строчного текстового поля,
- кнопкой «=», при нажатии на которую результат вычисления выводиться в третье текстовое поле,
- третьего одно-строчного тестового поля.
- реализуйте растяжение виджетов по ширине в зависимости от ширины окна.
- Добавьте проверку деления на 0. С выводом сообщения об ошибке, в удобное для пользователя место. Консольный вывод сообщения об ошибке исключить.
Python tkinter фрейм во фрейме
Каждый виджет, кроме окна, располагается в определенном родительском контейнере. Например:
from tkinter import * from tkinter import ttk root = Tk() root.title("METANIT.COM") root.geometry("250x200") lbl = ttk.Label(text="Hello") lbl.pack() root.mainloop() Здесь для метки lbl контейнером выступает главное окно — root. Однако графическое приложение может иметь более сложную структуру со множеством вложенных контейнеров. И для каждого виджета можно явным образом установить контейнер с помощью первого параметра конструктора, который называтся master . Например, в примере выше мы могли бы явным образом прописать для Label родительский контейнер:
lbl = ttk.Label(master=root, text="Hello") # или так lbl = ttk.Label(root, text="Hello")
В данном случае это не имеет смысла, кнопка по умолчанию добавляется в окно. Однако также мы можем определять вложенные контейнеры. В частности, для в Tkinter предназначен виджет Frame .
Frame
Frame отображает прямоугольник и обычно применяется для организации интерфейса в отдельные блоки. Некоторые основные параметры, которые мы можем установить через конструктор класса Frame:
- borderwidth : толщина границы фрейма, по умолчанию равно 0
- relief : определяет тип границы, может принимать значения SUNKEN, RAISED, GROOVE, RIDGE
- cursor : устанавливает курсор при наведении на фрейм
- height : высота фрейма
- width : ширина фрейма
- padding : отступы от вложенного содержимого до границ фрейма
import re from tkinter import * from tkinter import ttk root = Tk() root.title("METANIT.COM") root.geometry("250x200") frame = ttk.Frame(borderwidth=1, relief=SOLID, padding=[8, 10]) name_label = ttk.Label(frame, text="Введите имя") name_label.pack(anchor=NW) name_entry = ttk.Entry(frame) name_entry.pack(anchor=NW) frame.pack(anchor=NW, fill=X, padx=5, pady=5) root.mainloop() Здесь фрейм имеет границу толщиной в 1 пиксель. Граница представляет обычную линию ( relief=SOLID ). Также для фрейма заданы внутренние отступы: 8 по горизонтали и 10 по вертикали. Для установки отступов можно использовать следующие формы:
padding=10 # устанавливает общий доступ в 10 единиц padding=[8, 10] # отступ по горизонтали - 8, отступ по вертикали - 10 padding=[8, 10, 6, 5] # отступ слева 8, сверху - 10, справа - 6 и снизу 5
В сам фрейм добавляются два других виджета: Label и Entry. Для этого для обоих виджетов указываем фрейм в качестве родительского контейнера.
При этом мы можем вынести во вне создание фрейма:
from tkinter import * from tkinter import ttk def create_frame(label_text): frame = ttk.Frame(borderwidth=1, relief=SOLID, padding=[8, 10]) # добавляем на фрейм метку label = ttk.Label(frame, text=label_text) label.pack(anchor=NW) # добавляем на фрейм текстовое поле entry = ttk.Entry(frame) entry.pack(anchor=NW) # возвращаем фрейм из функции return frame root = Tk() root.title("METANIT.COM") root.geometry("250x200") name_frame = create_frame("Введите имя") name_frame.pack(anchor=NW, fill=X, padx=5, pady=5) email_frame = create_frame("Введите email") email_frame.pack(anchor=NW, fill=X, padx=5, pady=5) root.mainloop() Здесь для создания фрейма определена функция create_frame, которая возвращает фрейм с меткой и текстовым полем. Далее создаем с помощью этой функции два фрейма и добавляем их в окно: