Как открыть qt designer linux

Обновлено: 06.07.2024

Qt - это бесплатная, кроссплатформенная среда разработки приложений с открытым исходным кодом для настольных, встраиваемых и мобильных устройств. Он поддерживает различные платформы, такие как Linux, OS X, Windows, VxWorks, QNX, Android, iOS, BlackBerry, Sailfish OS и другие. Больше, чем язык программирования. Qt - это фреймворк, написанный на C ++. Препроцессор Meta-Object Compiler используется для расширения языка C ++ такими функциями, как сигналы и слоты. Перед этапом компиляции MOC анализирует исходные файлы, написанные на C ++ с расширением Qt, и генерирует из них совместимые со стандартами источники C ++. Таким образом, сам фреймворк и приложения / библиотеки, использующие его, могут быть скомпилированы любым стандартным компилятором C ++, таким как Clang, GCC, ICC, MinGW и MSVC.

В этой статье мы сначала опишем, как установить Qt Creator через командную строку. Затем мы объясним, как написать простую программу Qt Hello World и выполнить ее через:

  • Командная строка
  • GUI компилятора Qt

Мы запустили команды и процедуры, упомянутые в этой статье, в системе Debian 10 Buster ,

Установка Qt Creator

Давайте сначала начнем с установки Build Essential, который представляет собой метапакет, который позволяет устанавливать и использовать инструменты C ++ в Debian.

Откройте командную строку Debian, Terminal, либо через панель поиска Application Launcher, как показано ниже:


Затем выполните следующую команду от имени sudo, чтобы обновить индекс локального репозитория с помощью Интернета:


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

Теперь выполните следующую команду от имени sudo, чтобы установить пакет Build Essential:


Обратите внимание, что только авторизованный пользователь может добавлять, удалять, обновлять и настраивать программное обеспечение в Debian. Пожалуйста, введите свой пароль и введите Y, когда система предложит вам продолжить установку.

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


Пожалуйста, введите Y, когда система предложит вам продолжить установку.

Если вы хотите, чтобы Qt 5 использовалась в качестве версии Qt Creator по умолчанию, введите следующую команду:


Пожалуйста, введите Y, когда система предложит вам продолжить установку.

Чтобы развернуть более сложные проекты позже, вам нужно будет установить документацию и примеры Qt. Вы можете сделать это, выполнив следующую команду от имени sudo:

  • qt5-doc: Этот пакет содержит документацию по API Qt 5.
  • qtbase5-examples: Этот пакет содержит примеры Qt Base 5.
  • qtbase5-doc-html: Этот пакет содержит документацию HTML для базовых библиотек Qt 5.


Пожалуйста, введите Y, когда система предложит вам продолжить установку.

Теперь вы готовы использовать командную строку Qt Creator и инструменты пользовательского интерфейса!

Ваша первая программа Qt; Написано и скомпилировано с терминала

Такой опытный человек, как я, всегда ищет решения всех проблем программирования в самом терминале. В конце концов, очень просто писать и компилировать программы Qt из командной строки Debian. Пожалуйста, следуйте этим шагам, чтобы написать и выполнить простую программу Qt из Терминала.

Шаг 1: Создайте каталог проекта

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

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


Шаг 2. Создайте файл .cpp в каталоге проекта.

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

Затем создайте основной файл .cpp в этом каталоге с помощью редактора nano в виде следующим образом:

Конечно, вы можете использовать любой из ваших любимых текстовых редакторов для этой цели.


В пустом файле скопируйте эту программу Qt, единственная цель которой - напечатать строку предложения в окне с заголовком «Моя первая программа Qt».

Совет. Вы можете скопировать этот код, выбрав его здесь, а затем вставить его в файл с помощью сочетания клавиш Ctrl + Shift + V. Кроме того, вы можете вставить выбранный тест, используя опцию Вставить из контекстного меню в файле.


Выйдите из файла с помощью сочетания клавиш Ctrl + X и сохраните его, введя Y, а затем нажмите Enter.

Шаг 3: Создайте файл проекта Qt

После сохранения файла выполните следующую команду, чтобы создать файл проекта Qt:


Выполнение команды ls покажет, что вышеуказанная команда создала файл по имени SampleProject.pro в каталоге проекта. Этот файл проекта является основным файлом скелета для проектов Qt, и его можно редактировать для сложных целей.

Шаг 4: Небольшая настройка файла проекта Qt

Поскольку мы хотим скомпилировать проект из командной строки, нам нужно добавить следующую строку в наш файл .pro.

QT + = графические виджеты

Откройте файл SampleProject.pro в редакторе nano следующим образом:


Добавьте вышеупомянутые лайки и сохраните файл, нажав Ctrl + X, а затем введите Y и нажав Enter.

Шаг 5: Запустите qmake для настройки платформы проекта.

Чтобы настроить платформу файлов .pro, необходимо выполнить следующую команду для файла проекта:


Это создаст файл с помощью имя «Makefile» в каталоге проекта. Вы можете убедиться в этом, выполнив команду ls, как и я.

Шаг 6: Создать и выполнить исполняемый файл Qt для проекта

Следующая команда make поможет вам скомпилировать Makefile в исполняемую программу.


При условии, что в вашем проекте нет ошибок, эта команда должна создать исполняемую программу в вашем рабочем каталоге.Вы можете убедиться в этом, выполнив команду ls, как и я.

Файл SampleProject, выделенный зеленым цветом, является моей исполняемой программой Qt.

Шаг 7: Запустите исполняемый файл

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

Вот выходные данные программы:


Окно с заголовком и меткой, которые мы предоставили в коде!

Ваша первая программа Qt, скомпилированная из пользовательского интерфейса Qt Creator

Если вы заинтересованы в выполнении той же программы из пользовательского интерфейса Qt Creator, пожалуйста, следуйте этой процедуре:

Запустите приложение Qt Creator либо через поиск в Панели запуска приложений системы как следует или непосредственно через список приложений.


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

Приложение откроется в следующем представлении.

Создайте новый проект, нажав кнопку «Новый проект» в следующем представлении «Проекты»:


Это откроет представление «Новый файл или проект» следующим образом:


Здесь мы выберем шаблон для нашего проекта. Нажмите на опцию приложения temp на панели Project и выберите Qt Widgets Application в качестве шаблона. Этот шаблон создает приложение Qt для рабочего стола. Он включает в себя главное окно на основе Qt Designer. Нажмите на кнопку «Выбрать» после выбора. откроется следующее представление приложения Qt Widgets:


Введите имя вашего проекта Qt и укажите место, где вы хотите его создать. Затем нажмите Далее; откроется следующее представление для выбора набора:


Убедитесь, что Desktop выбран в качестве набора, и нажмите кнопку Далее. Затем вам будет предоставлена ​​информация о классе следующим образом:


Вы, конечно, можете изменить имена классов по своему желанию, но для вашей первой программы Qt мы предпочитаем использовать имена файлов по умолчанию. Нажмите Next, и вам будут представлены следующие детали управления проектами:


Qt Creator откроет ваш файл mainwindow.cpp по умолчанию. Нажмите на файл main.cpp в иерархии проекта, представленной в самой левой панели. В файле main.cpp замените существующий код следующим:

Вот так должно выглядеть окно вашего проекта:


Сохраните файл с помощью сочетания клавиш Ctrl + S или выбрав «Сохранить» в Файловое меню.

Наконец, запустите проект с помощью сочетания клавиш Ctrl + R или выберите «Выполнить» в меню «Сборка».

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


Окно с указанным нами заголовком и меткой!

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


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

Цель: собрать и настроить окружение, пройти путь от установки PyQt5 и создания формы в Qt Designer до запуска переносимого бинарника под Windows (да, всё верно, разрабатываем под Mint, собираем для linux и windows).

Пути установки

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

Настройка окружения

Создаём структуру директорий. Откройте консоль и выполните:

Ставим пакет, который потребуется нам для сборки в будущем:

Ставим pip и virtualenv:

Создаём виртуальное окружение, активируем его и обновляем пакеты:

Ставим Qt5. При выборе пути установки я оставил «по-умолчанию»

/Qt. Если Вы выберите другой, то необходимо менять пути в командах ниже:

Ставим SIP — модуль, необходимый для работы PyQt:

На этом всё. Окружение установлено и готово к работе. Для проверки выполните команду:

Ответ должен выглядеть следующим образом:

Для проверки, что всё действительно установилось в виртуальное окружение, откройте новое окно терминала и повторите команду проверки:

В ответ должна появиться ошибка ImportError. Новое окно терминала после этого можно закрыть.

Создание приложения

Перейдём в директорию с нашими исходниками и создадим директорию проекта:

Далее нам потребуется Qt Designer. Если Вы не меняли пусть установки Qt, то запустить его можно командой:


Вот так выглядит запущенный Qt Designer на моей системе:

В данном руководстве я не буду подробно останавливаться на описании интерфейса дизайнера, мы пройдём простейший путь до минимальной готовой формы. Если Вам необходима более подробная информация — Google It!


В диалоговом окне выбираем «Widget» (последний пункт в списке «templates/forms») и нажимаем кнопку «Создать». Откроется форма редактирования виджета:

Перетащите на форму кнопку из меню слева и сохраните полученную форму с именем test.ui в директорию


/dev/src/pyqt_test/:

Tips&Tricks: Нажав [Crtl + R] Вы можете запустить свою форму и «потрогать» её в режиме реального времени.

Конвертируем файл интерфейса из XML формы в понятную python форму:

Я не хочу редактировать что-либо в файле, созданном конвертером PyQt, поэтому наши слоты мы опишем в отдельном файле. Создайте файл test_slots.py и откройте его в любимом Вами редакторе. Наполнение файла должно выглядеть примерно так:

Затем, создайте ещё один файл с именем main.py, в котором мы опишем основную логику:

На этом наше приложение завершено. Выполнив из консоли


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


Упаковка в исполняемый файл для Linux

Упаковщик потребует некоторой магии при установке.
Скачиваем пакет, не устанавливая его и распаковываем:

Открываем любимым редактором файл cx_Freeze-4.3.4/setup.py. Я использую SublimeText:


Правим строку №84, чтобы она выглядела, как на картинке:

Tips&Tricks: А вы знали, что если запустить SublimeText из виртуального окружения, то интерпретатором по-умолчанию будет из виртуального окружения?

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

После этого в директории с исходниками появится директория dist, в которой среди множества файлов можно заметить файл без расширения main — это и есть наш бинарник, готовый для запуска и переноски. Откровенно говоря, немного расстраивает размер дистрибьютива: на моей машине это — 70,1 Мб, но не стоит забывать, что туда упакованы: python, PyQt, Qt и некоторые общесистемные библиотеки. Сборочный скрипт cxfreeze достаточно гибко конфигурируется, но подбор оптимальных параметров я оставлю на совести читателя. Скажу только, что счастье кроется в сжатии, оптимизации и ручном ограничении зависимостей.

Упаковка в исполняемый файл для Windows

К сожалению, чуда не будет. Мне не известен способ собрать exe напрямую из-под Linux-системы. Поэтому, придётся потанцевать с wine.
Закрываем открытый в самом начале терминал:

Открываем новый, ставим последнюю версию wine:

После этого скачиваем windows-версии уже знакомых нам пакетов и запускаем установку из-под wine:

А дальше немного магии. Идём по ссылке:

Качаем актуальную версию cx_Freeze для нашего интерпретатора и ставим поверх официальной:

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

Оказалось, что у меня в распоряжении нет windows-машины, поэтому смог протестировать результат только под wine. Выходим из терминала wine (команда exit), закрываем терминал. Идём раздавать нашу программу всем желающим.

С каждым годом становится все больше операционных систем, и потому разработчикам все труднее удовлетворять потребности пользователей. Три самые популярные компьютерные платформы - Windows, Linux и Mac OS, а также три мобильные - Android, iOS и Windows Mobile - продолжают активно бороться между собой. А это значит, что качественное приложение должно работать на всех основных платформах.

Что такое Qt Creator

Qt Creator (не так давно имевший название Greenhouse) - это одна из самых распространенных кроссплатформенных IDE. Ее плюсы - удобство, быстрота работы, а также - свободность, так как это ПО с открытым исходным кодом. Поддерживаются такие языки, как C, С++, QML.

Программа была написана компанией под названием Trolltech, которая в полной мере выполнила цель создания среды - работу с графическим фреймворком Qt. Удобный графический интерфейс с поддержкой Qt Widgets и QML, а также большое число поддерживаемых компиляторов позволяют быстро и удобно создать свое кроссплатформенное приложение.

Главная задача этой IDE - обеспечить наиболее быструю кроссплатформенную разработку, используя собственный фреймворк. Благодаря этому разработчики получают прекрасную возможность не писать приложения нативно (т. е. отдельно под каждую платформу), а создать общий код, и, возможно, подогнать его под особенности используемых ОС.

Qt Creator также включает в себя утилиту Qt Designer, что позволяет обработать внешний вид окна приложения, добавляя и перетаскивая элементы (аналогично Windows Forms в Visual Studio). В качестве систем сборки используются qmake, cmake и autotools.

Установка Qt Creator

Итак, пора рассмотреть как установить Qt Creator. Если для Windows разработчики позаботились и сделали оффлайн-установщик, то в Linux 32-bit этой возможности не предусмотрено. Поэтому во время установки вам может потребоваться стабильное интернет-соединение (

20-30 минут). Для начала скачаем установщик:

После окончания загрузки переходим в папку с файлом, нажимаем правой кнопкой мыши и выбираем пункт "Свойства".

Меню "Свойства"

Теперь перейдем на вкладку "Права" и поставим галочку "Разрешить запуск этого файла в качестве программы".

Изменение прав запуска

Приветственное окно

Теперь нажимаем "Next".

Меню выбора аккаунта

Здесь необходимо выбрать существующий аккаунт или создать его. Данное действие необходимо для проверки лицензии (коммерческой или некоммерческой).

Предварительное меню

Нажимаем "Next".

Выбор домашней папки

Выбираем директорию, в которой будет находиться Qt. Важно, чтобы в пути не было кириллицы и пробелов!

Выбор компонентов

В этом меню находится выбор компонентов. К примеру, можно выбрать установку инструментов для разработки на Android, или же исходных компонентов (это нужно для статической сборки, если кому-то это нужно - напишите в комментариях, и я напишу отдельную статью). Если Вы не уверены, нужны Вам эти компоненты или нет, оставьте их пока так - даже после установки Qt будет возможным удаление и добавление элементов.

Принятие лицензии

В этом окне принимаем лицензию. Жмем "Next".

Установка

Если Вы готовы, начинайте установку. У Вас запросят пароль суперпользователя (sudo), после чего начнется скачивание и извлечение файлов. Альтернативный способ - установка через терминал. Для начала необходимо обновить список пакетов.

sudo apt update

Скачиваем и устанавливаем Qt:

sudo apt install qt5-default

Теперь установка Qt Creator:

sudo apt install qtcreator

И, если нужно, исходники.

sudo apt install qtbase5-examples qtdeclarative5-examples

Настройка Qt Creator

После окончания установки перезагрузите компьютер и запустите Qt Creator. Перейдите в меню "Инструменты" -> "Параметры".

Главное окно

Здесь следует рассмотреть несколько вкладок.

1. Среда - это настройка внешнего вида самой IDE, а также изменение сочетаний клавиш и управление внешними утилитами.

Меню "Среда"

2. Текстовый редактор - здесь идет настройка внешнего вида, шрифтов и расцветки редактора.

Меню "Текстовый редактор"

3. C++ - подсветка синтаксиса, работа с расширениями файлов и UI (т. е. формами).

Меню "С++"

4. Android - здесь собраны пути к необходимым инструментам, а также в этом меню настраиваются подключаемые или виртуальные устройства.

Меню "Android"

Установка компонентов Qt Creator

Если вдруг так случилось, что Вы забыли установить какой-то компонент, или, наоборот, хотите его удалить, то на помощь придет Qt Maintenance Tool. Это инструмент, позволяющий управлять всеми компонентами Qt Creator.

Чтобы запустить его, перейдите в меню приложений, выберите пункт "Разработка" -> "Qt Maintenance Tool".

Qt Maintenance Tool

Выберите необходимый пункт (Удалить/добавить компоненты, обновить компоненты или удалить Qt). После выполните необходимые операции и закройте окно.

Работа с Qt Creator - первый проект

Ну что же, час пробил! Установка Qt Creator завершена. Пора сделать свое первое кроссплатформенное приложение на Linux, а затем скомпилировать его на Windows. Пусть это будет. программа, выводящая иконку Qt, кнопку и надпись, на которую по нажатию кнопки будет выводиться случайная фраза. Проект несложный, и, конечно же, кроссплатформенный!

Для начала откроем среду разработки. Нажмем "Файл" -> "Создать файл или проект. ". Выберем приложение Qt Widgets - его быстро и удобно сделать. А название ему - "Cross-Platphorm". Вот как!

Комплект - по умолчанию. Главное окно тоже оставляем без изменений. Создаем проект.

Для начала необходимо настроить форму - главное окно приложения. По умолчанию оно пустое, но это не останется надолго.

Перейдем в папку "Формы" -> "mainwindow.ui". Откроется окно Qt Designer:

Qt Designer

Удаляем панель меню и панель инструментов на форму, нажав правой кнопкой мыши и выбрав соответствующий пункт. Теперь перетаскиваем элементы Graphics View, Push Button и Label таким образом:

Окно программы

Чтобы изменить текст, дважды кликните по элементу. В свойствах Label (справа) выбираем расположение текста по вертикали и по горизонтали - вертикальное.

Теперь пора разобраться с выводом иконки. Перейдем в редактор, слева кликнем по любой папке правой кнопкой мыши и выберем "Добавить новый. ". Теперь нажимаем "Qt" -> "Qt Resource File". Имя - res. В открывшемся окне нажимаем "Добавить" -> "Добавить префикс", а после добавления - "Добавить файлы". Выбираем файл, а в появившемся окне "Неверное размещение файла" кликаем "Копировать".

Выбор файла

Получилось! Сохраняем все. Снова открываем форму. Кликаем правой кнопкой мыши по Graphics View, выбираем "styleSheet. " -> "Добавить ресурс" -> "background-image". В левой части появившегося окна выбираем prefix1, а в правой - нашу картинку. Нажимаем "ОК". Настраиваем длину и ширину.

Все! Теперь можно приступать к коду. Клик правой кнопкой мыши по кнопке открывает контекстное меню, теперь надо нажать "Перейти к слоту. " -> "clicked()". В окне набираем следующий код:

Код

Или вы можете скачать полный проект на GitHub. Работа с Qt Creator завершена, нажимаем на значок зеленой стрелки слева, и ждем запуска программы (если стрелка серая, сначала нажмите на значок молотка). Запустилось! Ура!

Программа

Выводы

Установка и настройка Qt Creator завершена. Теперь вы сможете создавать свои программы под огромное число платформ, оставляя код нетронутым! Кстати, установив Qt на Windows, вы сможете скомпилировать этот проект и там. Удачи вам!

Эта статья предназначена для тех, кто только начинает своё знакомство с созданием приложений с графическим интерфейсом (GUI) на Python. В ней мы рассмотрим основы использования PyQt в связке с Qt Designer. Шаг за шагом мы создадим простое Python GUI приложение, которое будет отображать содержимое выбранной директории.

Что нам потребуется

Нам понадобятся PyQt и Qt Designer, ну и Python, само собой.

В этой статье используется PyQt5 с Python 3, но особых различий между PyQt и PySide или их версиями для Python 2 нет.

Windows: PyQt можно скачать здесь. В комплекте с ним идёт Qt Designer.

macOS: Вы можете установить PyQt с помощью Homebrew:

$ brew install pyqt5

Linux: Всё нужное, вероятно, есть в репозиториях вашего дистрибутива. Qt Designer можно установить из Центра Приложений, но PyQt придётся устанавливать через терминал. Установить всё, что нам понадобится, одной командой можно, например, так:

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

Если вы используете Windows, то, скорее всего, путь C:\Python36\Scripts (измените 36 на вашу версию Python) не прописан в вашем PATH . Загляните в этот тред на Stack Overflow, чтобы узнать, как решить проблему.

Дизайн

Основы

Теперь, когда у нас всё готово к работе, давайте начнём с простого дизайна.

Sportmaster Lab , Санкт-Петербург, Москва, Липецк , От 100 000 до 150 000 ₽

Откройте Qt Designer, где вы увидите диалог новой формы, выберите Main Window и нажмите Create.

Создание новой формы в Qt Designer

После этого у вас должна появиться форма — шаблон для окна, размер которого можно менять и куда можно вставлять объекты из окна виджетов и т.д. Ознакомьтесь с интерфейсом, он довольно простой.

Теперь давайте немного изменим размер нашего главного окна, т.к. нам не нужно, чтобы оно было таким большим. А ещё давайте уберём автоматически добавленное меню и строку состояния, поскольку в нашем приложении они не пригодятся.

Все элементы формы и их иерархия по умолчанию отображаются в правой части окна Qt Designer под названием Object Inspector. Вы с лёгкостью можете удалять объекты, кликая по ним правой кнопкой мыши в этом окне. Или же вы можете выбрать их в основной форме и нажать клавишу DEL на клавиатуре.

Удаление ненужных элементов с формы

В итоге мы имеем почти пустую форму. Единственный оставшийся объект — centralwidget , но он нам понадобится, поэтому с ним мы ничего не будем делать.

Теперь перетащите куда-нибудь в основную форму List Widget (не List View) и Push Button из Widget Box.

Макеты

Вместо использования фиксированных позиций и размеров элементов в приложении лучше использовать макеты. Фиксированные позиции и размеры у вас будут выглядеть хорошо (пока вы не измените размер окна), но вы никогда не можете быть уверены, что всё будет точно так же на других машинах и/или операционных системах.

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

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

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

Теперь в меню Qt Designer нажмите Form, затем выберите Preview и увидите что-то похожее на скриншот выше. Выглядит хорошо, не так ли? Но вот что случится, когда мы изменим размер окна:

Проблема при изменении размера окна

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

Основное окно уже поддерживает макеты, поэтому нам ничего не нужно добавлять в нашу форму. Просто кликните правой кнопкой мыши по Main Window в Object Inspector и выберите Lay outLay out vertically. Также вы можете кликнуть правой кнопкой по пустой области в форме и выбрать те же опции:

Вертикальное расположение виджетов

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

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

Горизонтальное размещение двух кнопок в вертикальном

Если у вас не получается переместить элемент в главном окне, вы можете сделать это в окне Object Inspector.

Последние штрихи

Теперь, благодаря вертикальному размещению, наши элементы выровнены правильно. Единственное, что осталось сделать (но не обязательно), — изменить имя элементов и их текст.

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

Свойства элементов можно изменить в разделе Property Editor.

Подсказка: вы можете менять размер, передвигать или добавлять часто используемые элементы в интерфейс Qt Designer для ускорения рабочего процесса. Вы можете добавлять скрытые/закрытые части интерфейса через пункт меню View.

Нажмите на кнопку, которую вы добавили в форму. Теперь в Property Editor вы должны видеть все свойства этого элемента. В данный момент нас интересуют objectName и text в разделе QAbstractButton . Вы можете сворачивать разделы в Property Editor нажатием по названию раздела.

Измените значение objectName на btnBrowse и text на Выберите папку.

Должно получиться так:

Изменение названия и текста кнопки

Именем объекта списка является listWidget , что вполне подходит в данном случае.

Сохраните дизайн как design.ui в папке проекта.

Превращаем дизайн в код

Конечно, можно использовать .ui -файлы напрямую из Python-кода, однако есть и другой путь, который может показаться легче. Можно конвертировать код .ui -файла в Python-файл, который мы потом сможем импортировать и использовать. Для этого мы используем команду pyuic5 из терминала/командной строки.

Чтобы конвертировать .ui -файл в Python-файл с названием design.py , используйте следующую команду:

Пишем код

Теперь у нас есть файл design.py с нужной частью дизайна нашего приложения и мы начинать работу над созданием его логики.

Создайте файл main.py в папке, где находится design.py .

Используем дизайн

Для Python GUI приложения понадобятся следующие модули:

Также нам нужен код дизайна, который мы создали ранее, поэтому его мы тоже импортируем:

Так как файл с дизайном будет полностью перезаписываться каждый раз при изменении дизайна, мы не будем изменять его. Вместо этого мы создадим новый класс ExampleApp , который объединим с кодом дизайна для использования всех его функций:

В этом классе мы будем взаимодействовать с элементами интерфейса, добавлять соединения и всё остальное, что нам потребуется. Но для начала нам нужно инициализировать класс при запуске кода. С этим мы разберёмся в функции main() :

И чтобы выполнить эту функцию, мы воспользуемся привычной конструкцией:

В итоге main.py выглядит таким образом:

Если запустить этот код: $ python3 main.py , то наше приложение запустится!

Запущенная программа

Но нажатие на кнопку ничего не даёт, поэтому нам придётся с этим разобраться.

Добавляем функциональность в наше Python GUI приложение

Примечание Весь дальнейший код пишется внутри класса ExampleApp .

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

Добавьте эту строку в метод __init__ класса ExampleApp , чтобы выполнить привязку при запуске приложения. А теперь взглянем на неё поближе:

  • self.btnBrowse : здесь btnBrowse — имя объекта, который мы определили в Qt Designer. self говорит само за себя и означает принадлежность к текущему классу;
  • clicked — событие, которое мы хотим привязать. У разных элементов разные события, например, у виджетов списка есть itemSelectionChanged и т.д.;
  • connect() — метод, который привязывает событие к вызову переданной функции;
  • self.browse_folder — просто функция (метод), которую мы описали в классе ExampleApp .

Для открытия диалога выбора папки мы можем использовать встроенный метод QtWidgets.QFileDialog.getExistingDirectory :

Если пользователь выберет директорию, переменной directory присвоится абсолютный путь к выбранной директории, в противном случае она будет равна None . Чтобы не выполнять код дальше, если пользователь закроет диалог, мы используем команду if directory: .

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

И получить список содержимого следующим образом:

Для добавления элементов в listWidget мы используем метод addItem() , а для удаления всех элементов у нас есть self.listWidget.clear() .

В итоге функция browse_folder должна выглядеть так:

Теперь, если запустить приложение, нажать на кнопку и выбрать директорию, мы увидим:

Готовое графическое приложение (Python GUI), отображающее содержимое папки со своим исходным кодом

Так выглядит весь код нашего Python GUI приложения:

Это были основы использования Qt Designer и PyQt для разработки Python GUI приложения. Теперь вы можете спокойно изменять дизайн приложения и использовать команду pyuic5 без страха потерять написанный код.

На этом уроке мы познакомимся с кроссплатформенным фреймворком Qt и установим IDE для работы с ним.

Введение в Qt

Qt является кроссплатформенным (не зависящим от платформы/ОС) фреймворком для разработки приложений на языке С++. С помощью Qt были разработаны такие известные приложения, как: KDE, Opera, Google Earth и Skype. Впервые Qt был опубликован в мае 1995 года.

Qt5 подразумевает двойное лицензирование, а это означает, что Qt может быть использован в некоммерческих целях для создания приложений с открытым исходным кодом, а также как лицензия для коммерческих клиентов. За счет использования собственного фреймворка и мощного инструментария Qt позволяет быстро и удобно создавать собственные кроссплатформенные приложения. Кроме того, команды разработчиков получают возможность работать на разных платформах, используя при этом общие инструменты для разработки и отладки. Весь инструментарий Qt с открытым исходным кодом вы можете найти на сайте qt.io.

Изначально Qt был разработан норвежской компанией по разработке программного обеспечения Trolltech. В 2008 году компанию приобрела Nokia. Спустя четыре года в августе 2012 программные технологии Qt выкупила финская компания-разработчик Digia. Сейчас Qt развивается компанией QT Company, которая является дочерней компанией Digia, и как проект Qt под открытым исходным кодом с участием отдельных разработчиков и фирм.

Установка Qt Creator в Linux

Шаг №1: Мы будем устанавливать IDE с открытым исходным кодом. Для этого переходим по ссылке и выбираем самую свежую версию (на момент написания данной статьи — это Qt 5.13):



После окончания загрузки переходим в папку с необходимым нам файлом, нажимаем на него правой кнопкой мыши и выбираем "Свойства" . На вкладке "Основные" видим "Имя" , "Тип" , "Размер файла" , а также наименование родительской папки:


Переходим на вкладку "Права" и ставим галочку возле пункта "Разрешить выполнение файла как программы" :


Закрываем "Свойства" и запускаем программу.

Шаг №2: На следующем этапе установщик сообщает, что нам предоставлена версия с открытым исходным кодом Qt 5.13.0. Дальнейшая установка Qt предполагает регистрацию в Qt и создание Qt Account, который предоставляет доступ ко всем возможностям Qt. Кроме того, данное действие необходимо для проверки лицензии (коммерческая/некоммерческая). Если у вас уже есть учетная запись в Qt Account, то используйте кнопку "Next" .

Если учетной записи в Qt Account у вас еще нет, то её можно создать сейчас: для этого перейдите по соответствующей ссылке в установщике, и вы будете перенаправлены на сайт qt.io в соответствующий раздел, или просто используйте кнопку "Next" — вы сможете это сделать на следующем шаге:


Шаг №3: Здесь необходимо ввести логин и пароль от Qt Account или создать Qt Account, если его у вас еще нет. Кнопка "Next" переводит нас на следующий этап:



Шаг №4: Выбираем каталог для установки Qt 5.13.0. Обратите внимание, адрес каталога указывается латинскими буквами (без кириллицы) и без пробелов! После того, как выбрали каталог, нажимаем "Далее >" :


Шаг №5: Выбираем компоненты, которые хотим установить. Если на данном этапе у вас нет уверенности в выборе конкретных компонентов, то добавление и удаление можно будет сделать позже, после установки программы:


Шаг №6: Принимаем лицензионное соглашение:


И нажимаем на кнопку "Установить" :


Для завершения установки нажимаем "Завершить" . После завершения установки Qt Creator запустится самостоятельно (для этого необходимо поставить галочку возле пункта "Launch Qt Creator" ):


Вот примерно следующее вы должны увидеть при запуске Qt Creator:


Поздравляем! Qt Creator установлен.

Установка Qt Creator через командную строку в Linux

Еще одним альтернативным и простым способом установки Qt Creator в Linux на основе Debian является установка из пакетов. Если при работе с Linux вы используете терминал, то перед скачиванием и установкой Qt Creator программа запросит пароль пользователя root (команда sudo без дополнительных опций). Только после этого начнется скачивание и извлечение файлов. Обычно, пакеты Linux не содержат последней версии Qt и их необходимо обновить. Ниже приведен алгоритм действий, позволяющий за 4 шага установить Qt Creator через терминал в Linux.

Шаг №1: Обновление набора утилит для установки, удаления, обновления, поиска пакетов в Linux.

$ sudo apt update

Шаг №2: Скачивание и установка Qt.

$ sudo apt install qt5-default

Шаг №3: Установка Qt Creator.

$ sudo apt install qtcreator

Шаг №4: Установка тестовых программ.

$ sudo apt install qtbase5-examples qtdeclarative5-examples

Установка Qt Creator в Windows

Сначала нам нужно скачать установочный пакет Qt. Вы можете это сделать, обратившись к оф. сайту qt.io. Либо же воспользоваться альтернативным вариантом и скачать с какого-нибудь «зеркала» (например, c этого, полный список всех «зеркал» находится здесь):


Нажимаем на official_releases/ и переходим к online_installers/ :


Нажимаем на online_installers/ и скачиваем файл qt-unified-windows-x86-online.exe :


Запустив скачанный файл, видим перед собой приветствие «Qt Online Installer». Нажимаем "Next" :


Далее у нас спросят о наличии Qt Account. Можно смело нажимать "Skip" и двигаться дальше:


Затем снова "Далее" :


Теперь нам нужно указать путь установки Qt. Для простоты я выбрал C:\Qt :


На следующем шаге нам нужно выбрать набор компиляторов, которыми мы будем пользоваться на данных уроках. Я предлагаю ограничиться выбором пакета MinGW 7.3.0 32-bit , а остальные метки поставить так, как указано на скриншоте ниже:


После того, как инсталлятор скачает и установит все необходимые компоненты, можно будет перейти к непосредственному написанию кода для нашего приложения.

Создание проекта

Вначале нам необходимо создать проект. Сразу скажу, что наша программа будет консольным приложением. Для этого выберите "Файл" > "Создать файл или проект…" или можно воспользоваться сочетанием клавиш Ctrl+N :


Перед вами появится «Мастер настройки проектов». В левой колонке отметьте пункт "Приложение" , а затем в правой — "Консольное приложение Qt" :


На следующем шаге нужно будет указать имя для нашей будущей программы и папку, где будут располагаться файлы проекта. У меня это My_QtApplication и C:\dev\Qt_Project соответственно:


На следующем шаге без изменений, поэтому просто нажимаем кнопку "Далее" :


Теперь нам нужно выбрать набор компиляторов, который мы будем использовать для сборки нашего проекта. Я настоятельно рекомендую выбрать Desktop Qt 5.13.0 MinGW 32-bit (сняв при этом отметки с остальных, если они у вас есть):


На последнем шаге нажимаем "Завершить" :


Теперь вы можете увидеть автоматически сгенерированный Qt-проект консольного приложения. Давайте рассмотрим его детально:

Читайте также: