Быстрый старт Qt Designer

Использование Qt Designer включает четыре основных шага:

1. Выбор формы и объектов
2. Размещение объектов на форме
3. Подключение сигналов к слотам
4. Предпросмотр формы

Предположим, что вы хотите разработать небольшой виджет (см. скриншот выше), который содержит элементы управления, необходимые для управления значениями Красного, Зелёного и Синего (RGB) — тип виджета, который можно увидеть повсюду в программах обработки изображений.

Выбор формы Вы начинаете с выбора Widget в диалоговом окне Новая форма.

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

Чтобы убедиться, что они выстроены точно так же в вашей программе, вам нужно поместить эти виджеты в макет. Мы будем делать это группами по три. Выберите метку «КРАСНЫЙ». Затем удерживайте клавишу Ctrl, пока вы выбираете соответствующий спин-бокс и ползунок. В меню Форма выберите Разместить в таблицу.

Повторите этот шаг для других двух меток вместе с соответствующими спин-боксами и ползунками.

Следующим шагом является объединение всех трех макетов в один главный макет. Главный макет — это макет виджета верхнего уровня (в данном случае QWidget). Важно, чтобы ваш виджет верхнего уровня имел макет; в противном случае виджеты на вашем окне не будут изменять свой размер при изменении размера вашего окна. Для установки макета щелкните правой кнопкой мыши в любом месте вашей формы, вне трех отдельных макетов, и выберите Разместить горизонтально. В качестве альтернативы, вы также можете выбрать Разместить в таблицу — вы по-прежнему увидите ту же компоновку (показанную ниже).

Когда вы нажимаете на ползунок и перетаскиваете его до определенного значения, вы хотите, чтобы спин-бокс отображал положение ползунка. Для достижения этого поведения вам нужно подключить сигнал valueChanged() ползунка к слоту setValue() спин-бокса. Вам также нужно сделать обратные подключения, например, подключить сигнал valueChanged() спин-бокса к слоту setValue() ползунка.

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

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

Повторите шаг (в обратном порядке), нажав на спин-бокс и перетащив курсор к ползунку, чтобы подключить сигнал valueChanged() спин-бокса к слоту setValue() ползунка.

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

Теперь, когда вы успешно подключили объекты для компонента «КРАСНЫЙ» RGB-контроллера, сделайте то же самое для компонентов «ЗЕЛЁНЫЙ» и «СИНИЙ».

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

Установка свойств виджетов Щёлкните по первому спин-боксу. В Редакторе свойств вы увидите свойства QSpinBox. Введите «255» для свойства maximum. Затем, щелкните по первому вертикальному ползунку, вы увидите свойства QAbstractSlider. Введите «255» для свойства maximum также. Повторите этот процесс для оставшихся спин-боксов и ползунков.

Теперь предварительно просмотрите свою форму, чтобы увидеть, как она будет выглядеть в вашем приложении — нажмите Ctrl + R или выберите Предварительный просмотр из меню Форма. Попробуйте перетащить ползунок — спин-бокс также будет отображать его значение (и наоборот). Также вы можете изменить его размер, чтобы увидеть, как макеты, используемые для управления дочерними виджетами, реагируют на разные размеры окна.