Виджеты и компоновки PyQt



Система компоновки Qt предоставляет простой и мощный способ организации дочерних виджетов внутри родительского виджета.



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

Эти компоновки автоматически позиционируют и изменяют размер виджетов.

И все виджеты Qt могут использовать компоновки для управления своими дочерними элементами с помощью функции setLayout.



Здесь мы с помощью компоновки QHBoxLayout располагаем метки горизонтально в окне QWidget.



Компоновка QVBoxLayout размещает метки вертикально.



Компоновка QGridLayout располагает элементы в сетке.

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

Также можно указать затем сколько строк и столбцов должен заполнять элемент.



Компоновка QFormLayout добавляет два виджета в строку, обычно QLabel и QLineEdit для создания форм.

В качестве резюме – виджеты могут иметь в качестве родительских только другие виджеты, но не компоновки.

Но вы можете вкладывать компоновки в родительскую компоновку с помощью метода addLayout, тогда внутренний макет становится дочерним по отношению к макету, в который он вставлен.

Теперь, модуль Qt Widgets предоставляет набор элементов пользовательского интерфейса для создания пользовательских интерфейсов приложения.

И все, что вы видите в приложении PyQt, представляет собой виджеты: кнопки, метки, окна, диалоговые окна, индикаторы выполнения и т. д.



С меткой мы уже познакомились.

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

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

К счастью, у нас есть метод adjustSize, который автоматически настраивает размер метки.

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

И метод move определяет начальную позицию метки от левого верхнего угла экрана.



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

В PyQt такой способ ввода данных – это использование виджета QLineEdit.

Или если вы хотите получить ввод многострочного текста, вам нужно использовать виджет QTextEdit.

И конечно ввод как правило используется вместе с кнопкой QPushButton.

Чтобы получить введенный текст из виджета QLineEdit, вы должны использовать метод text.

Здесь мы создаем кнопку Submit, которая вызывает функцию show, использующую метод text виджета QLineEdit.

Мы также создаем кнопку Clear, которая вызывает метод clear виджета QLineEdit, который удаляет все его содержимое.

Метод SetEchoMode принимает несколько различных «режимов», одним из которых является режим пароля, который скрывает ввод.

Используя метод setFixedWidth, мы можем установить размер виджета QLineEdit в пикселях.

Значение по умолчанию для каждого виджета составляет около 100 пикселей.

Теперь о кнопке QPushButton.

Как следует из названия, это кнопка, которая запускает функцию при нажатии.

Кнопка, которая не связана с функцией, бесполезна.

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

И такая функция подключается с помощью метода clicked.connect.

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

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



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

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

Здесь мы добавляем элементы в список по одному методом addItem.

Хотя мы можем добавить сразу все элементы кортежем с помощью метода addItems.

Зафиксировать ширину списка мы можем методом setFixedWidth.

Теперь, обработать выбор пользователем элемента в списке мы можем с помощью метода currentText(), который возвращает элемент списка в виде строки.



Теперь перейдем к флажкам и радиокнопкам.

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

Мы делаем это с помощью метода stateChanged.connect.

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

И вы можете использовать метод checkState, который возвращает целое число 0, если флажок не выбран и 2 – если он выбран.

Метод isChecked возвращает true, если флажок выбран.



В отличие от флажка, вы можете выбрать только одну радиокнопку из многих.

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

Мы делаем это с помощью метода toggled.connect.

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

Есть еще один метод, который вы можете использовать – это метод isChecked, который возвращает true или false, показывая состояние выбора переключателя.



Как и виджет QLineEdit, виджет QTextEdit используется для ввода данных пользователем в виде текста.

Однако, в отличие от QLineEdit, который вводит только одну строку, QTextEdit позволяет ввести несколько строк текста.

Чтобы получить от пользователя введенный текст, мы можем использовать метод toPlainText и метод кнопки clicked.connect.

Метод setPlaceholderText используется для установки в виджет выделенного серым цветом текста, который исчезает при взаимодействии с виджетом.

Метод setUndoRedoEnabled отключает / включает возможность для пользователя использовать функции Undo и Redo с помощью клавиш Ctrl + Z и Ctrl + Y.



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

И в PyQt5 есть виджет QInputDialog, который позволяет создавать множество различных диалоговых окон для ввода данных различными способами.

И самое распространенное диалоговое окно – это ввод текста.

Оно представляет собой простое поле ввода и две кнопки, ОК и Отмена.

Функция getText возвращает два значения, поэтому мы устанавливаем две переменные для них.

Первая переменная input получает ввод пользователя, вторая переменная получает значение True или False, указывающее, была ли нажата кнопка OK или нет.

Далее есть диалоговое окно ввода целого числа.

Здесь вы можете использовать стрелки для изменения целочисленного значения или непосредственно ввести значение самостоятельно.



Следующее окно – это окно выбора элемента.

И здесь мы сначала определяем список / кортеж строк, отображаемых в качестве элементов.

И последнее диалоговое окно – это окно ввода чисел с плавающей запятой.

Здесь вы также можете использовать стрелки для изменения значения или непосредственно ввести значение самостоятельно.



QMessageBox – это виджет, который используется для создания диалоговых окон для отображения различных сообщений и кнопок.

Как правило, в приложении определяется метод, который открывает окно сообщения.

И этот метод связывается с какой-нибудь кнопкой или событием приложения.

Здесь метод setWindowTitle устанавливает заголовок окна сообщения.

Метод setText устанавливает текст под заголовком.

Метод exec открывает окно сообщения.

Окно сообщения имеет 4 различных типа значков, которые можно изменить с помощью метода setIcon.

В окне сообщения по умолчанию используется кнопка «ОК».

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

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

Когда окно открывается, вокруг кнопки «ОК» есть синий контур.

Это обозначение кнопки по умолчанию.

Используя функцию setDefaultButton, мы можем изменить кнопку по умолчанию.

По умолчанию у нас есть только одна область в QMessageBox, где мы показываем текст.

Однако есть еще две дополнительные области, которые мы можем разблокировать, чтобы добавить больше текста.

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

Вторая область текста отображается в расширении окна.

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

И для создания этой области потребуется функция setDetailedText.

Теперь, если у нас есть 3 разные кнопки в окне сообщений, как мы узнаем, какая из них была нажата?

Используя метод buttonClicked.connect, мы можем вызвать запуск функции всякий раз, когда нажимается кнопка в окне сообщения.

Здесь когда нажимается кнопка окна сообщений, она автоматически запускает функцию popup, объявленную в buttonClicked.connect.

И вызов функции text кнопки вернет ее текстовое значение.



Виджет ProgressBar, индикатор выполнения – это отличный способ визуализировать процесс выполнения длительных операций, таких как передача файлов, загрузка, выгрузка, копирование и т. д.

Здесь с помощью метода setGeometry, мы определяем расположение и размеры индикатора выполнения.

Первые два параметра представляют положение X и Y индикатора выполнения в окне.

Третий и четвертый параметры – это ширина и высота индикатора выполнения.

Метод setValue устанавливает значения индикатора.

Однако имейте в виду, что диапазон для индикатора выполнения составляет от 0 до 100.

Если вы хотите изменить этот диапазон, используйте метод setRange.

Метод reset сбрасывает значение на индикаторе выполнения.

Метод value возвращает текущее целочисленное значение индикатора.



Виджет PyQt QSlider предоставляет графический интерфейс для выбора значения из диапазона различных значений.

У виджета Slider есть ползунок, который можно перемещать.

При перемещении ползунка выбранное значение соответственно изменяется.

По умолчанию ориентация слайдера вертикальная.

Для горизонтального ползунка вам нужно использовать значение Qt.Horizontal.

Затем нам нужно установить минимальный и максимальный диапазон с помощью методов setMinimum и setMaximum.

Используя метод setGeometry, мы определяем расположение и размеры слайдера.

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

Третий и четвертый параметры – это ширина и высота слайдера.

Затем нам нужно установить Ticks, маркеры по ползунку.

Вы можете выбрать место размещения тиков и установить интервал для расстояния между тиками.

Используя метод valueChanged, мы можем связать значение ползунка с функцией show.

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



Виджет PyQt5 QDateEdit – это интерактивный и визуальный способ ввести дату в приложении.

Здесь вы можете редактировать дату вручную или с помощью встроенных клавиш со стрелками.

И здесь вам не нужно назначать минимальное или максимальное значение, PyQt сам назначит значения по умолчанию.

Но вы можете сделать это с помощью методов setMinimumDate и setMaximumDate.

Чтобы получить введенную дату, вы можете использовать метод date и метод toPyDate, чтобы распечатать дату в более читаемом формате.