Урок #3 – Разработка внутри Qt Designer

За разработку графического дизайна отвечает программа Qt Designer. Она позволяет быстро реализовать графическую составляющую. За урок мы научимся работать с программой и создадим на ее основе программу «Калькулятор».
Видеоурок
Программа Qt Designer
Qt Designer обеспечивает разработчика полноценным графическим редактором. Через него вы можете добавлять виджеты, свойства, а также создавать сигналы (обработчики событий).
Помимо добавления объектов вы можете создавать меню для ваших проектов. Можно управлять статус баром (status bar), меню (menu bar) и toolbar.
Преобразование в «.py»
Qt Designer создает файл с расширением «.ui». Для редактирования такого файла через PyQt 5 его сперва необходимо преобразовать в файл «.py». Этапы преобразования:
- Установите через терминал pyqt и pyqt-tools:
pip install pyqt5 pip install pyqt5-tools
- Перейдите в папку, где сохранен файл с расширением «.ui»
- Выполните команду:
pyuic5 -x file_name.ui -o new_file.py
- Далее у вас будет Python файл, что можно редактировать через любой текстовый редактор
Qt designer как пользоваться
Одной из популярных сред разработки под С++ является среда Qt Creator. Qt Creator является кроссплатформенным, может работать на Windows, Linux и macOS и позволяет разрабатывать широкий диапазон приложений — десктопные и мобильные приложения, а также приложения для встроенных платформ. Рассмотрим, как создать простейшую программу на С++ в Qt Creator.
Загрузим программу установки. Для этого перейдем на страницу https://www.qt.io/download-qt-installer
Сайт автоматически определяет текущую операционную систему и предлагает для нее загрузить онлайн-установщик. Для загрузки нажмем на кнопку Download:

Регистрация программы установки
После загрузки запустим программу установки:

Вначале программа установки предложит осуществить вход с логином и паролем от учетной записи QT. Однако если у вас нет учетной записи QT, то необходимо зарегистрироваться. Для этого нажмем на ссылку «Зарегистрироваться». И в поля ввода введем логин-электронный адрес и пароль:

Нажмем на кнопку «Далее». После этого на указанный электронный адрес придет ссылка, по которой надо перейти для завершения регистрации.

После этого в программе установки QT снова нажмем на кнопку «Далее»

Установка
Затем отметим пару флажков и нажмем на кнопку «Далее»:

И после этого мы перейдем непосредственно к установке затем отметим пару флажков и нажмем на кнопку «Далее»:

Затем нам будет предложено выбрать, надо ли отправлять отчет :

Далее надо будет указать каталог для установки (можно оставить каталог по умолчанию), а также тип установки:

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

В данном случае я выбрал для установки последнюю на данный момент версию Qt — Qt 6.2.3 за исключением двух пакетов (MSVC 2019). При установке для Windows прежде всего стоит отметить пункт компилятора MinGW — на данный момент это MinGW 11.2.0. 64-bit . Остальные компоненты можно устанавливать при необходимости. При установки следует учитывать свободное место на жестком диске, так как некоторые компоненты занимают довольно многом места.
В зависимости от текущей операционной системы набор компонентов может отличаться. Например, набор компонентов для Qt 6.2.3 для MacOS:

Затем надо принять лицензионное соглашение и настроить ярлык для меню Пуск. И далее нажмем на кнопку «Установить»:

Создание проекта С++ в Qt Creator
После завершения установки запустим Qt Creator. На стартовом экране выберем вкладку Projects (Проекты), на которой нажмем на кнопку New (Создать):

В окне создания нового проекта в качестве шаблона проекта выберем Plain C++ Application :

Далее надо будет задать имя проекта и каталог, где он будет располагаться:

На следующих шагах оставим все значения по умолчанию. И на последнем шаге нажмем на кнопку Finish для создания проекта:

И нам откроется проект с некоторым содержимым по умолчанию:

Проект будет иметь один файл — main.cpp , и в центральной части — текстовом редакторе будет открыт его код:
#include using namespace std; int main()
Запустим его, нажав на зеленую стрелку в нижнем левом углу Qt Creator. И в нижней части Qt Creator откроется окно Application Output с результатами работы скомпилированной программы
PyQt – Использование Qt Designer
Установщик PyQt поставляется с инструментом для создания графического интерфейса, который называется Qt Designer . Используя простой интерфейс перетаскивания, можно быстро создать интерфейс GUI без необходимости писать код. Это, однако, не IDE, такие как Visual Studio. Следовательно, Qt Designer не имеет средства для отладки и сборки приложения.
Создание интерфейса GUI с использованием Qt Designer начинается с выбора окна верхнего уровня для приложения.

Затем вы можете перетащить нужные виджеты из поля виджетов на левой панели. Вы также можете присвоить значение свойствам виджета, заложенным в форму.

Разработанная форма сохраняется как demo.ui. Этот файл пользовательского интерфейса содержит XML-представление виджетов и их свойств в дизайне. Этот дизайн переведен в эквивалент Python с помощью утилиты командной строки pyuic4. Эта утилита является оберткой для модуля uic. Использование pyuic4 выглядит следующим образом –
pyuic4 –x demo.ui –o demo.py
В приведенной выше команде ключ -x добавляет небольшой объем дополнительного кода к сгенерированному XML, чтобы он стал самостоятельным исполняемым приложением.
if __name__ == "__main__": import sys app = QtGui.QApplication(sys.argv) Dialog = QtGui.QDialog() ui = Ui_Dialog() ui.setupUi(Dialog) Dialog.show() sys.exit(app.exec_())
Результирующий скрипт Python выполняется, чтобы показать следующее диалоговое окно –

Пользователь может вводить данные в поля ввода, но нажатие на кнопку «Добавить» не будет генерировать никаких действий, поскольку они не связаны ни с какой функцией. Реакция на сгенерированный пользователем ответ называется обработкой события .
Разработка графического интерфейса с помощью библиотеки Qt3
Авторы, держатели авторских прав и издатель приложили немало усилий при подготовке этой книги, но не предоставляют никаких явных или подразумеваемых гарантий любого вида и не принимают на себя ответственность за возможные ошибки или упущения. Сведения, приводимые в этой книге, носят исключительно информационный характер и могут быть изменены без дополнительного уведомления. Ни авторы, ни издатель, ни держатели авторских прав не несут никакой ответственности за непредвиденные убытки, прямо или косвенно связанные с использованием информации или программ, содержащихся здесь.
| След. |
| Вступительное слово. |