Pyqt как открыть окно

PyQt6 — это полное руководство для начинающих. Продолжение

В первой статье мы говорили о создании первого окна, о сигналах, слотах и ​​событиях, а также о виджетах. Сегодня в начале курса по Fullstack разработке на Python делимся продолжением: про макеты, работу с тулбарами и меню с помощью QAction, аддоны и диалоги. Подробнее см. в кат.

Дизайны

Ранее мы создали окно и добавили в него виджет. Нам нужно добавить больше виджетов и определить, где они будут. Для этого Qt использует макет . Существует 4 основных макета, как показано в этой таблице:

Горизонтальный линейный макет

Вертикальный линейный макет

Индексированная сетка X-by-Y

Z — Stacked Widgets

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

Qt имеет три макета макета для виджетов: VBoxLayout, QHBoxLayout и QGridLayout. И есть QStackedLayout, который позволяет размещать виджеты друг над другом в одном месте, отображая только один макет за раз. Сначала нам нужен простой макет приложения, где мы будем экспериментировать с разными макетами. Сохраните следующий код в файле app.py:

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

В этом коде мы пишем подкласс QWidget для виджета пользовательского цвета, который при создании принимает один параметр, цвет (str). Сначала установите для .setAutoFillBackground значение True, чтобы фон виджета автоматически заполнялся цветом окна. Затем мы получаем текущую палитру (по умолчанию используется глобальная палитра рабочего стола) и меняем текущий цвет QPalette.Window на новый QColor, соответствующий переданному значению цвета. Мы применяем эту палитру к виджету. Результатом является виджет, заполненный сплошным цветом (который вы указываете при его создании).

Ничего страшного, если что-то непонятно, позже мы рассмотрим пользовательские виджеты более подробно. А пока просто поймите, что вы можете создать виджет, заполненный сплошным красным цветом, одним вызовом:

Сначала мы протестируем новый виджет «Цвет», который заполняет все окно цветом. Когда вы закончите, добавьте его в QMainWindow с помощью .setCentralWidget, чтобы получить сплошное красное окно:

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

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

QVBoxLayout: виджеты располагаются вертикально

В QVBoxLayout виджеты размещаются друг над другом. Другой. После добавления виджет будет отправлен в конец столбца.

Смещение QVBoxLayout сверху вниз

Давайте добавим виджет в макет. Чтобы добавить макет в QMainWindow, вам нужно применить его к фиктивному QWidget, а затем применить виджет и макет к окну с помощью .setCentralWidget. Цветные виджеты будут размещены в макете содержится в QWidget в окне. Сначала добавьте красный виджет, как и раньше:

Читайте также:  Девушка не может получить организм как быть

Теперь вы можете видеть рамку вокруг красного виджета. Это пространство между рисунками; позже мы увидим, как это настроить.

Если вы добавите в макет несколько цветных виджетов, они будут размещены вертикально в том порядке, в котором они были добавлены:

QHBoxLayout: горизонтальные виджеты

Макет QHBoxLayout такой же, только виджеты здесь расположены горизонтально. Виджет добавляется с правой стороны.

QHBoxLayout заполняется слева направо

Просто измените макет с QVBoxLayout на QHBoxLayout. Виджеты теперь располагаются слева направо:

Вложенные макеты

Есть более сложные макеты, состоящие из вложенных макетов. Такая вложенность делается в макете с помощью .addLayout. Далее мы добавляем QVBoxLayout к основному QHBoxLayout. Если вы добавите дополнительные виджеты в QVBoxLayout, они будут размещены вертикально в первом пространстве основного макета:

Старт. Виджеты должны быть расположены в 3 столбца по горизонтали, а в первом столбце также будет 3 виджета по вертикали. Попробуйте!

Установите расстояние между макетами с помощью .setContentMargins и между элементами с помощью .setSpacing:

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

QGridLayout: виджеты в сетке

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

исправляет проблему

QGridLayout отображает позиции сетки для каждого местоположения

Элементы QGridLayout расположены особым образом. Для каждого виджета указано его положение в строке и столбце. Если вы опустите элементы, они останутся пустыми. Однако с QGridLayout вам не нужно заполнять все позиции в сетке.

QGridLayout с пустыми слотами

QStackedLayout: несколько виджетов в одном месте

Наконец , давайте посмотрим на макет QStackedLayout. В нем элементы располагаются один за другим. Вы можете выбрать, какой виджет отображать. QStackedLayout используется для слоев векторной графики в графическом приложении или для имитации интерфейса с вкладками. Также существует виджет-контейнер QStackedWidget с точно таким же принципом работы. Используется при использовании .setCentralWidget для добавления и размещения виджетов непосредственно в QMainWindow.

QStackedLayout — здесь вы видите только верхний виджет, который первым добавляется в макет QStackedLayout — здесь вы выбираете второй виджет (обозначенный номером 1) и сдвинут вперед

Представления с вкладками работают с QStackedWidget. Видно в любое время Есть только одна карта (вкладка). .setCurrentIndex() или .setCurrentWidget() определяет, какой виджет отображается в данный момент: здесь элемент устанавливается по индексу в том порядке, в котором были добавлены виджеты, или по самому виджету.

Вот один быстрый пример использования QStackedLayout совместно с QButton при реализации интерфейса с вкладками:

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

В Qt есть виджет TabWidget, который предоставляет макет по умолчанию, хотя и в виде виджета. Вот пример вкладки, воссозданной с помощью QTabWidget:

Интерфейс вкладок с использованием QTabWidget

Читайте также:  Как можно открыть химчистку

Видите? Немного проще и приятнее! Расположение закладок устанавливается по сторонам света, а возможность их перемещения задается с помощью .setMoveable. Панель вкладок в macOS отличается: по умолчанию они перечислены в виде колец и обычно используются на панелях настроек. Режим документа включен для документов , что создает тонкие этикетки, аналогичные этикеткам на других платформах. Эта опция применима только к macOS:

QTabWidget в режиме документа в macOS

Мы рассмотрим другие виджеты более подробно позже.

Вы можете продолжить изучение Python прочитав книгу автора или наши курсы:

Панели инструментов, меню и QActions

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

Панели инструментов

Панель инструментов — один из наиболее распространенных элементов пользовательского интерфейса. Это панели со значками и/или текстом, которые используются в приложении для выполнения общих задач, доступ к которым через меню затруднен. Эта функция пользовательского интерфейса присутствует практически во всех приложениях. Хотя некоторые сложные приложения, особенно в пакете Microsoft Office, перенесены на контекстно-зависимые ленточные интерфейсы, стандартной панели инструментов обычно достаточно для большинства приложений, которые вы создаете.

Стандартные элементы графического интерфейса

Начнем с «каркаса» простого приложения и его настройки. Сохраните этот код в своем файле app.py (содержит все импортированные данные для последующих шагов):

Если вы переходите с PyQt5 на PyQt6, QAction в новой версии доступен через модуль QtGui.

Добавление панели инструментов

Панель инструментов в Qt создается из класса QToolBar. Давайте добавим панель инструментов в приложение, сначала создав экземпляр класса, а затем вызвав .addToolbar в QMainWindow. Передавая строку в качестве первого параметра в QToolBar, мы устанавливаем имя панели инструментов: эта панель инструментов идентифицируется им в пользовательском интерфейсе:

Start. В верхней части окна появится тонкая серая линия. Это панель инструментов. Щелкните правой кнопкой мыши и выберите имя панели, чтобы отключить ее.

Окно панели инструментов

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

Сделаем панель немного интереснее. Вместо добавления виджета QButton мы используем другую функциональность Qt: класс QAction для описания абстрактных пользовательских интерфейсов.

С его помощью они находятся внутри Объект определяет различные элементы интерфейса, с которыми пользователь может взаимодействовать. Например, параметр «Вырезать» доступен в меню «Правка» и на панели инструментов (значок ножниц). Доступ к нему можно получить, нажав Ctrl-X (Cmd-X на Mac).

Без QAction вам пришлось бы определить это в нескольких местах. А в Qt мы определяем QAction с инициируемым действием, которое добавляется как в меню, так и на панель инструментов. Каждое действие QAction имеет имена, сообщения о состоянии, значки и сигналы подключения (и многое другое).

Читайте также:  Как легко открыть крышку бутылки стеклянной

Вот первое добавленное действие QAction:

Сначала мы создаем функцию, которая получает сигнал от действия QAction. (так мы проверяем его работоспособность). Затем мы определяем сам QAction. При создании экземпляра передается метка для действия и/или значок.

Вы также должны передать любой QObject (предок действия). Мы передаем себя как ссылку на главное окно. Странно для QAction, родительский элемент передается в последнем параметре

Далее задайте подсказку состояния: этот текст будет отображаться в строке состояния при его появлении. Наконец, мы присоединяем сигнал .triggered к пользовательской функции. Запускается при вызове (или активации) QAction .

Приступим! Появится кнопка с меткой, которую мы определили. Щелкните ее, и пользовательская функция вернет состояние щелчка и кнопки.

Панель инструментов QButton

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

Добавить Статус бар. Мы создаем объект строки состояния, вызывая QStatusBar и передавая его в .setStatusBar. Вам не нужно менять настройки этой строки состояния (строки состояния): просто передайте ее одной строкой при создании:

Старт. Наведите указатель мыши на кнопку на панели инструментов, чтобы отобразить текст состояния в строке состояния.

Текст строки состояния обновляется при наведении курсора на действие

Теперь давайте сделаем QAction переключаемым: на первый щелчок включает, второй раз выключает. Для этого просто вызовите setCheckable(True) в объекте QAction:

Launch и нажмите кнопку; его состояние меняется с нажатого на ненажатое. Однако функция пользовательского слота теперь переключает вывод True и False.

Кнопка на панели инструментов включена

Существует переключатель .toggled, который сигнализирует только о включении/отключении кнопки. Эффект тот же, поэтому никаких специальных .toggled не требуется.

Добавьте значок к кнопке. Загрузите отличный набор красивых иконок Fugue 16x16px от Yusuke Kamiyamane, чтобы придать своим приложениям приятный профессиональный вид. Это бесплатно: все, что вам нужно для распространения приложения, — это поблагодарить автора.

Набор значков утечки Юсуке Камиямане

Выберите изображение (я выбрал файл .png с прослушиванием) и скопируйте в исходные папки. Создайте объект QIcon, передав имя файла классу, например QIcon(‘bug.png’). Если вы поместите файл в другой файл, вам потребуется полный абсолютный или относительный путь. Наконец, чтобы добавить значок и кнопку в QAction, просто передайте их в качестве первого параметра при создании QAction.

Вам также необходимо указать размер значков, иначе вокруг них будет много отступов. Мы делаем это, вызывая функцию .setIconSize() с объектом QSize:

Start. QAction теперь является значком. Все должно работать точно так же, как и раньше.

Кнопка действия теперь со значком

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

Источник

Поделиться с друзьями
Решатор