Питон и графический интерфейс OTUS

Содержание

Python – известный язык разработки, который может похвастаться не просто читабельным кодом и низким порогом вхождения, но и функциональностью. Он используется для написания самых разных программ – от десктопных до мобильных и консольных, от бизнес-приложений до небольших игр. Иногда выступает дополнительным инструментом разработчика.

При помощи Python, как говорит Google, можно писать и графические интерфейсы. Далее этот вопрос будет рассмотрен более подробно. Предстоит выяснить, что собой представляет GUI, для чего он нужен, как пишется на рассматриваемом языке программирования. Эта информация пригодится и начинающему разработчику, и уже опытному специалисту.

GUI – это…

GUI (Graphical User Interface) – графический пользовательский интерфейс. Своеобразная оболочка программного обеспечения, с которой взаимодействует клиент при помощи клавиатуры и мыши. Форма интерфейса, которая, согласно Google, позволяет пользователям взаимодействовать с программным обеспечением при помощи аудио-индикаторов и графических иконок (кнопок).

Google указывает на то, что графический интерфейс появился как ответ на CLI (интерфейс командной строки), требующей знания команд и их набора с клавиатуры. С GUI пользователи сталкиваются каждый день, когда читают статьи и новости в браузерах, набирают текст в редакторах или играют в игры.

Противоположностью GUI является командная строка. Она позволяет управлять системой не через дружелюбный графический интерфейс, а при помощи специальных текстовых команд. Встретить такой вариант манипулирования системой (CLI) можно в MacOS (терминал), а также в Linux. В Windows подобные возможности тоже есть. Они представлены командной строкой.

Инструменты разработчика

GUI Python написать можно несколькими способами. Пользовательскую оболочку для приложения редко создают «с нуля». У Питона имеются специальные инструменты, способствующие более быстрой ее разработке. Google называет их фреймворками и библиотеками. В них есть все, чтобы писать функциональные пользовательские окна (window).

Google выделяет следующие GUI-фреймворки и библиотеки:

PyQt5;
Tkinter;
PySide2;
Kivy;
PySimpleGUI;
Eel;
wxPython;
PyGObject;
PyGu;
PyForms.

Далее все перечисленные библиотеки будут рассмотрены более подробно. На наиболее известных и применяемых из них представлены наглядные примеры разработки user window для приложения.

Для чего нужны GUI-библиотеки

Google описывает Python как один из самых известных и распространенных языков программирования. Он подойдет как для клиент-серверных моделей, так и для создания графических пользовательских интерфейсов. Чтобы не приходилось каждый раз писать одни и те же функциональности с нуля, были придуманы фреймворки и библиотеки.

GUI-библиотеки дают возможность написания персонализированных графических интерфейсов пользователя для совершенно разных приложений. С их помощью разработка программного обеспечения становится на порядок проще. Users Window получается при помощи упомянутых инструментов красивым, с интуитивно понятным интерфейсом. Библиотеки и фреймворки Python повышают интерактивность программы и ее функциональные возможности, а также способствуют облегченной обработке данных.

GUI-фреймворки активно используются для создания программ с графическим интерфейсом:

графических редакторов;
видео-плееров;
аудио-плееров;
игр;
систем управления базами данных и других приложений.

Иногда они применяются при веб-разработке сайтов – там, где для работы с пользователями необходимо обеспечить высокий уровень интерактивности.

Краткий обзор фреймворков

Google указывает на то, что у Python очень много библиотек для написания пользовательских интерфейсов любой сложности. Их основной список был представлен выше. Не все указанные библиотеки пригодятся разработчикам. Чтобы понимать, на что обратить внимание в первую очередь, нужно хотя бы поверхностно изучить каждый фреймворк.

Google описывает указанные продукты так:

PyForms – кроссплатформенный инструмент разработчика. Google указывает, что он базируется на основе Qt. Позволяет создавать программное обеспечение с графическим интерфейсом через редактирование XML-документов.
PyGObject – GUI-библиотека, созданная на основе GObject Introspection. Позволяет создавать User Window с потрясающей графической оболочкой.
PyGU – работа с этим инструментом осуществляется при помощи SVG-графики. Он имеет понятный интерфейс и подойдет для написания любых интерактивных приложений с минимальными знаниями Питона.
PySimpleGUI – простейшая библиотека для написания user window. Ей очень удобно пользоваться. Все виджеты будут генерироваться за счет определенного набора методов и функций.
Eel – инструмент программиста для написания кроссплатформенных проектов на базе Electron или Flask. Поддерживает возможность работы с JavaScript, CSS и HTML в процессе формирования user window.
wxPython – еще один кроссплатформенный фреймворк. Разработан на базе C++. Поддерживает качественно реализованный API и дружественные пользовательские сообщества. Его достаточно легко освоить каждому программисту.
PySide2 – бесплатная библиотека, которая выступает альтернативой PyQt на основе Qt5. Поддерживает более свободную лицензию, чем PyQt. Функционально от «платной» версии инструмента практически ничем не отличается.
Kivy – кроссплатформенная GUI-библиотека Python. Используется для программирования мультимедийных приложений путем использования графики OpenGL ES 2.
PyQt5 – функциональный и кроссплатформенный инструмент разработчика для GUI. Google указывает на то, что он базируется на Qt и позволяет создавать мощные графические проекты. Обладает развернутой детализированной документацией.
Tkinter – стандартная Python-библиотека для GUI. Отличается простотой использования. На ней обычно пишут простые проекты.

Google указывает на то, что углубленно изучать все перечисленные инструменты для того, чтобы сделать визуальное оформление программы на Питоне, необязательно. Далее более подробно будут изучены самые лучшие библиотеки для разработчиков GUI.

Eel

Eel – модуль, помогающий создавать пользовательские интерфейсы (users windows). Он подойдет тем, кто предварительно изучил CSS и HTML. С его помощью чаще всего пишутся веб-интерфейсы, представленные самостоятельными программами. Примером использования Eel может послужить известный проект – Discord. Он написан на прародителе Eel – Electron.

Google указывает, что с помощью этого инструмента можно не только создавать красивые интерфейсы через CSS и HTML, но и обеспечивать динамическую анимацию. Для этого предстоит воспользоваться JavaScript.

Особенности

Этот модуль создан на базе Chromium. Данная особенность может приводить к проблемам оптимизации и потребления оперативной памяти. В небольших проектах, как отмечает Google, этого недочета не заметно, а вот в масштабных приложениях – вполне.

Eel позволяет выигрывать в гибкости и упрощает разработку сложных адаптивных программ – для нее достаточно воспользоваться flexbox. Пример – если нужно написать приложение для просмотра и демонстрации больших таблиц, Eel допускает создание user window с HTML-фреймом Google Sheets.

Пользователь будет одновременно выполнять роль клиента и сервера. Eel запустит localhost:8000, а также откроет браузер (Chrome или Windows Edge) с флагом app, позволяющим задавать размер окна по умолчанию. Проекты компилируются через PyInstaller или Auto Py to EXE. После этого они могут распространяться в качестве исполняемых файлов (формата .exe).

PyQt

Модуль PyQt – профессиональный инструмент GUI-разработчика. Эта библиотека совмещается с билдером Qt Designer, который представлен набором готовых элементов интерфейса.

Google ссылается на то, что встроенных компонентов Qt у этого модуля всегда было достаточно, но некоторые из них могут некорректно срабатывать. Примером служит QTextBrowser. Этот компонент user window не способен считать сложный HTML-код вроде blockquote.

Основным преимуществом PyQt Google называет наличие подробной документации. В ней грамотно описаны все интерфейсные элементы, их характеристики и типы данных. По этому инструменту снято множество видеоуроков и гайдов. PyQt доступна на коммерческой и бесплатной основе (по лицензии GPL).

PySide

Пользовательское окно в Python можно создать при помощи PySide. Google называет этот инструмент библиотекой с открытым исходным кодом, поддерживающей связь с Qt. Qt – это кроссплатформенная разработка, UI-фреймворк для написания и развертывания приложений на разных операционных системах без предварительной переписи исходного кода.

PySide объединяет Qt и Python, предоставляя богатый набор инструментов для создания user window. Модуль подойдет не только для простых проектов, но и для достаточно сложных веб-сайтов.

Золотой стандарт – TKinter

Создание интерфейса в Python для пользователей – простая задача, если пользоваться специальными библиотеками и фреймворками рассматриваемого языка. Золотым стандартом и функциональным инструментом GUI-программистов Google называет TKinter. Это самый известный модуль. С его помощью можно программировать user window для:

Linux;
Windows;
MacOS.

Инструмент используется для получения кроссплатформенных и гибких проектов. Работа с TKinter может быть условно представлена в виде нескольких простейших шагов:

Процесс написания user window выглядит так:

Сначала программисту необходимо подключить библиотеку. TKinter обладает простой установкой. Провести ее поможет директива import: import tkinter as.
Создать окно (window) приложения, в котором будут размещаться все необходимые графические составляющие.
Добавить необходимые виджеты. Это визуальные компоненты, используемые для выполнения тех или иных действий.
Создать основной цикл событий. Google относит сюда все события, происходящие при пользовательском взаимодействии с GUIS.

Ключевыми объектами в работе TKinter Google называет виджеты. Они представляют собой своеобразные аналоги тегов HTML, которые дают возможность создания интерактивных и неинтерактивных элементов. Примерами могут послужить кнопки и надписи.

Google выделяет у рассматриваемой библиотеки всего 18 виджетов, но наиболее используемыми выступают следующие элементы:

menu – виджет, помогающий создавать меню в window;
label – контейнер, в котором будет размещаться текст или картинка;
canvas – пространство, на котором рисуются графические фигуры;
entry – инструмент, обеспечивающий в user window поля ввода;
button – кнопки.

Далее этот инструмент будет рассмотрен более подробно. С его помощью предстоит написать калькулятор расчета индекса массы тела. Это приложение обучит основам работы с библиотекой.

О чем нужно помнить разработчику

Google подчеркивает, что TKinter – простой и одновременно сложный инструмент для написания GUI-интерфейсов. При формировании масштабных пользовательских окон (window) могут возникнуть некоторые трудности: работать допустимо только с кодом, а механика размещения компонентов окажется не всегда очевидной.

Допустимо использование сетки grid, а также менеджеров геометрии – pack и place. Самый тяжелый этап Tkinter – это изучение соответствующих элементов разработки. Они особо важны для разработчиков, планирующих заниматься созданием адаптивных интерфейсов.

Первый проект на TKinter

GUI-интерфейс в Python (или users windows) можно создать при помощи библиотеки TKinter. Она используется как для крупных, так и для небольших проектов. Далее будет представлен процесс разработки user window для программы расчета индекса массы тела. Этот показатель оценивает наличие лишнего веса у человека, а также показывает наличие ожирения.

Для расчета ИМТ (индекса массы тела) необходимо воспользоваться формулой:

Результаты расчетов будут оцениваться по специальной таблице. У врачей она может быть представлена различными способами. В приложении предстоит воспользоваться элементарной версией:

Это – то, что должен учитывать программист перед непосредственной разработкой программного обеспечения для расчета ИМТ. Далее можно приступить к использованию TKinter и Python.

Запуск Python и импорт библиотеки

Google указывает на то, что любая PY-библиотека должна быть импортирована в проект. Писать код рекомендуется в специальной IDE. Пример – Visual Studio Code. Здесь есть подсветка синтаксиса, а также автоматическое предложение продолжения кода. Соответствующая функциональность значительно упрощает разработку.

TKinter, согласно Google, уже предустановлена в Python. Для ее использования предстоит лишь импортировать этот инструмент в проект:

Теперь можно заняться разработкой приложения и его user window.

Создание эскиза и логики

User Window нуждается в тщательной проработке перед реализацией в виде кода. Сначала разработчику нужно решить:

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

User Window в рассматриваемом проекте позволяет получить от пользователя рост и вес в виде простых чисел. Вес вводится в килограммах, рост – в сантиметрах. Индекс массы тела рассчитывается при нажатии на специальную кнопку. Результат произведенных расчетов выводится во всплывающем window в качестве значения индекса массы тела и категории, к которой он имеет непосредственное отношение.

Выше – наглядный пример того, как будет выглядеть app window. Это элементарный пример интерфейса.

Создание основного окна

Создание GUI на Python начинается с импорта библиотеки и загрузки ее методов:

Здесь первая строка дает возможность загрузки методов TKinter, а затем пользоваться ими в процессе написания исходного кода без ссылки на их именования. Вторая строка поддерживает явный импорт метода messagebox. Он используется для вывода всплывающего окна (result window) в качестве ответа на пользовательские действия. Этот прием является удобным, потому что упомянутый метод в исходном приложении потребуется несколько раз.

Теперь можно создать окно приложения (app window). Для этой цели рекомендуется использовать модуль TK. Программа будет называться «Калькулятор индекса массы тела (ИМТ)»:

После запуска предложенного фрагмента ничего не произойдет. Такое поведение Google не называет ошибочным. На самом деле код будет выполнен, а app window после этого закроется. Для устранения ситуации нужно явно указать, что окно программы не должно закрываться до тех пор, пока пользователь сам не инициирует соответствующий процесс. Google говорит о том, что к исходному коду нужно добавить функцию window.mainloop, указывающую на запуск цикла событий:

Чтобы окно поместилось на экране, рекомендуется воспользоваться методом geometry. Он используется для задания размера окна программы:

Теперь можно заняться контролем расположения компонентов программного обеспечения.

Frame и контроль расположения компонентов

В app window нужно разместить несколько элементов с получившегося ранее эскиза: два поля ввода данных с характерными подписями, а также одну кнопку. Требуется следить, чтобы эти компоненты не накладывались друг на друга и не уходили за пределы app window. Google указывает, что в TKinter для контроля за элементами есть разные методы:

Pack – применяется при работе с контейнерами для элементов. Дает возможность позиционировать кнопки, надписи и другие графические компоненты внутри контейнеров.
Place – используется для позиционирования по точным координатам.
Grid – применяется для размещения элементов по ячейкам словной сетки. Она будет служить разделителем окна программы.

Далее будут использованы grid и pack. Для начала нужно создать виджет Frame – в нем размещаются надписи, поля ввода и кнопки. Отступы по горизонтали и вертикали будут 10 пикселей:

Выше – фрагмент программного кода, который нужно добавить в свой проект.

Поля и кнопки

Следующий этап разработки – это добавление в окне приложения (app window) трех видов виджетов:

поле ввода данных (Entry);
текстовые надписи (Label);
кнопку (Button).

Google указывает на то, что надписи создаются через Label-виджет:

Ему передаются два параметра:

Frame – используется заготовка виджета Frame. В нем уже имеются настройки для отступов по вертикали и горизонтали.
Text – текст, который выводится на экран app window.

Для позиционирования Google рекомендует использовать grid-метод. Предстоит указать, что текст должен располагаться в ячейке с координатами «третья строка и первый столбец». При запуске программы надпись отобразится по центру. Нужное положение будет принято после добавления других компонентов.

Теперь можно добавить вторую надпись, но при позиционировании в grid указывается 4-я строка:

Поля ввода пользовательской информации добавляются, согласно Google, через Entry:

Для позиционирования здесь тоже используется метод grid. Entry должен быть расположен около надписи «Введите свой рост». Это приводит к тому, что нужно использовать ячейку в той же строке, но в другом столбце. Остается добавить поле ввода веса:

А вот принцип добавления кнопки, которая отвечает за расчет индекса массы тела:

Графическое приложение на Python почти готово. Остается написать код, который будет отвечать за получение данных из Entry и рассчитывать ИМТ.

Программирование функций

Google указывает на то, что для расчетов используется функция calculate:

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

Завершающий этап – привязка расчетов к нажатию по кнопке «Рассчитать ИМТ». Для этого Google требует использования свойства command в виджете Button:

Графический интерфейс на Python и простейшее первое приложение на TKinter готовы.

Интересует Python? Добро пожаловать на курс в Otus!