Создаём графический интерфейс на Python за 10 минут

Кросс-платформенно и наглядно

Создаём графический интерфейс на Python за 10 минут

Python — язык программирования для решения разных задач: на нём можно как играть в угадайку чисел, так и создавать нейросети. 

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

Сегодня мы научимся создавать графический интерфейс для программ — с кнопками, полями ввода и управление мышкой. А потом используем это для новых проектов.

Библиотека PySimpleGUI — простой интерфейс для Python

На самом деле у Python есть много библиотек, которые позволяют создать графический интерфейс — Tkinter, Qt, Remi или WxPython. Но проблема в том, что каждую из них нужно осваивать отдельно. Например, в одной удобно создавать графики, но неудобно — кнопки и надписи.

Чтобы сделать создание интерфейсов проще, придумали PySimpleGUI. Идея в том, чтобы объединить лучшие идеи из каждой библиотеки и написать для них внешнюю обёртку. 

В итоге программисту на Python достаточно взять уже готовую команду создания кнопки, а отрисовку и внешний вид программа возьмёт на себя. 

Ещё PySimpleGUI — это кросс-платформенное решение. Это значит, что интерфейсы, созданные с помощью этой библиотеки, будут работать одинаково на разных операционных системах.

Пара примеров, что можно сделать с PySimpleGUI:

Создаём графический интерфейс на Python за 10 минут
Создаём графический интерфейс на Python за 10 минут
Создаём графический интерфейс на Python за 10 минут
Создаём графический интерфейс на Python за 10 минут

Что для этого нужно

Для установки PySimpleGUI в командной строке компьютера или среды разработки пишем такую команду:

pip install pysimplegui

После этого библиотеку сразу можно подключать и использовать в проектах командой import PySimpleGUI. Но чтобы не писать каждый раз в коде такое громоздкое название, ей можно задать другое имя при подключении, например:

import PySimpleGUI as sg

Теперь нам достаточно написать sg вместо pysimplegui.

Если появилось такое сообщение, значит, библиотека установлена и готова к работе
Если появилось такое сообщение, значит, библиотека установлена и готова к работе

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

Сегодня мы посмотрим, как всё работает, и сделаем маленькую программу. Как разберёмся — возьмём проекты помасштабнее.

В редакторе кода создаём новый Python-файл и пишем такой код — в нём мы создаём простое окно с кнопкой и текстом:

# подключаем библиотеки
import PySimpleGUI as sg
import random

# что будет внутри окна
# первым описываем кнопку и сразу указываем размер шрифта
layout = [[sg.Button('Новое число',enable_events=True, key='-FUNCTION-', font='Helvetica 16')],
        # затем делаем текст
        [sg.Text('Результат:', size=(25, 1), key='-text-', font='Helvetica 16')]]
# рисуем окно
window = sg.Window('Генератор случайных чисел', layout, size=(350,100))
# запускаем основной бесконечный цикл
while True:
    # получаем события, произошедшие в окне
    event, values = window.read()
    # если нажали на крестик
    if event in (sg.WIN_CLOSED, 'Exit'):
        # выходим из цикла
        break
# закрываем окно и освобождаем используемые ресурсы
window.close()
За размер окна отвечает параметр size в последней команде
За размер окна отвечает параметр size в последней команде

Мы только что создали простой графический интерфейс, указав только три параметра: размер окна, кнопку и текстовое поле. Так как мы не задавали дополнительных параметров, библиотека сама разместила элементы внутри окна. Ещё у нас не прописана внутренняя логика, поэтому при нажатии на кнопку ничего не произойдёт. Исправим это и привяжем нажатие кнопки к появлению нового случайного числа.

Выдаём случайные числа

При создании кнопки мы использовали такой параметр:

key='-FUNCTION-'

Это значит, что при нажатии на кнопку окно отправит внутреннее системное сообщение с текстом -FUNCTION-. Если мы привяжем свою функцию к этому сообщению, то она будет выполняться при каждом нажатии кнопки. 

Чтобы связать функцию с сообщением от окна, добавим в конец основного цикла такую проверку:

# если нажали на кнопку
if event == '-FUNCTION-':
    # запускаем связанную функцию
    update()

Теперь у нас есть привязанная функция update(), но в коде её ещё нет. Исправим это и добавим новую функцию сразу после команд импорта:

# обрабатываем нажатие на кнопку
def update():
    # получаем новое случайное число
    r = random.randint(1,100)
    # получаем доступ к текстовому элементу
    text_elem = window['-text-']
    # выводим в него текст с новым числом
    text_elem.update("Результат: {}".format(r))

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

Собираем всё вместе и запускаем программу:

Создаём графический интерфейс на Python за 10 минут
# подключаем библиотеки
import PySimpleGUI as sg
import random

# обрабатываем нажатие на кнопку
def update():
    # получаем новое случайное число
    r = random.randint(1,100)
    # получаем доступ к текстовому элементу
    text_elem = window['-text-']
    # выводим в него текст с новым числом
    text_elem.update("Результат: {}".format(r))

# что будет внутри окна
# первым описываем кнопку и сразу указываем размер шрифта
layout = [[sg.Button('Новое число',enable_events=True, key='-FUNCTION-', font='Helvetica 16')],
        # затем делаем текст
        [sg.Text('Результат:', size=(25, 1), key='-text-', font='Helvetica 16')]]

# рисуем окно
window = sg.Window('Генератор случайных чисел', layout, size=(350,100))

# запускаем основной бесконечный цикл
while True:
    # получаем события, произошедшие в окне
    event, values = window.read()
    # если нажали на крестик
    if event in (sg.WIN_CLOSED, 'Exit'):
        # выходим из цикла
        break
    # если нажали на кнопку
    if event == '-FUNCTION-':
        # запускаем связанную функцию
        update()

# закрываем окно и освобождаем используемые ресурсы
window.close()

Что дальше

Мы сделали самый простой интерфейс и посмотрели, как можно связать внутреннюю логику и кнопки. В следующий раз используем это для более серьёзных проектов — нарисуем им свой интерфейс и научимся менять его внешний вид.

Частые вопросы о PySimpleGUI

Как в PySimpleGUI обрабатывать ввод данных из текстового поля?

Создайте текстовое поле с уникальным ключом, например sg.InputText(key='-INPUT-'). Когда пользователь введёт текст и нажмёт кнопку, прочитайте значение через словарь values в основном цикле: user_text = values['-INPUT-']

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

Можно ли упаковать программу на PySimpleGUI в исполняемый EXE-файл?

Да, для этого используйте утилиту PyInstaller. Установите её командой pip install pyinstaller, затем в терминале перейдите в папку с вашим скриптом и выполните pyinstaller --onefile --windowed имя_файла.py. Параметр --onefile упакует всё в один EXE-файл, а --windowed скроет консольное окно, оставив только графический интерфейс. 

Готовый файл появится в папке dist — его можно запускать на любом windows-компьютере без установки Python. Для Linux и macOS процесс аналогичный, только на выходе получится исполняемый файл под соответствующую систему.

Как изменить тему оформления (скин) окна в PySimpleGUI?

Добавьте команду sg.theme('название_темы') перед созданием окна. PySimpleGUI содержит десятки готовых тем — например, 'DarkBlue3', 'LightGreen', 'Reddit', 'Dark'. Чтобы посмотреть все доступные темы, выполните sg.theme_previewer() — откроется окно с образцами всех тем, где можно выбрать подходящую. 

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

Как создать многооконное приложение?

Создайте несколько объектов окон, например window1 и window2, но не запускайте для них разные циклы. В PySimpleGUI используется единый цикл событий для всех окон сразу. Вместо обычного window.read() используйте специальную функцию read_all_windows:

while True:
    # Ждём события от любого открытого окна
    window, event, values = sg.read_all_windows()
    
    # Если все окна закрыты — выходим
    if window is None and event == sg.WIN_CLOSED:
        break
        
    # Обрабатываем события конкретного окна
    if window == window1 and event == 'Ok':
        print('Нажали кнопку в первом окне')
        
    if window == window2 and event == 'Exit':
        window2.close()

Функция read_all_windows() сама определяет, в каком окне произошло действие, и возвращает ссылку на него в переменной window. Это самый эффективный способ, который не нагружает процессор лишними проверками.

Где найти полный список всех элементов (виджетов) PySimpleGUI и их параметров?

Полная документация находится на официальном сайте PySimpleGUI по адресу docs.pysimplegui.com. Там описаны все элементы: кнопки, текстовые поля, слайдеры, графики, таблицы, вкладки и многое другое. Для каждого виджета перечислены доступные параметры, примеры использования и скриншоты результата. 

Ещё на GitHub в репозитории PySimpleGUI есть папка DemoPrograms с готовыми примерами программ — можно скачать их, запустить и посмотреть, как реализованы разные элементы интерфейса.

Эта библиотека бесплатная?

Начиная с пятой версии PySimpleGUI изменили лицензию:

  • Для коммерческой разработки лицензия платная (99 $).
  • Для обучения и хобби лицензия условно-бесплатная на 30 дней, и нужна обязательная регистрация. Без этого окно программы не откроется.

Если вы не хотите регистрироваться и покупать лицензионные ключи, сообщество создало полный бесплатный аналог под названием FreeSimpleGUI. Он работает абсолютно так же, как старая добрая версия из нашей статьи.

Чтобы его использовать, установите pip install FreeSimpleGUI. Затем в коде скрипта замените строку import PySimpleGUI as sg на import FreeSimpleGUI as sg.

И всё. Весь остальной код из статьи будет работать без изменений.

Корректор:

Ира Михеева

Художник:

Алексей Сухов

Вёрстка:

Кирилл Климентьев

Вам может быть интересно
easy