Qt/C++ - Урок 010. QSplitter или Как добавить разделитель

QPallete, QSplitter, QSplitter color, QSplitter example, Qt

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

Структура проекта для QSplitter

Структура проекта для QSplitter

Структура проекта абсолютно ничем не примечательна и мало интересна, поскольку основные действия будут производиться в дизайнере, а настройку QSplitter в mainwindow.cpp будем производить минимальную.

Пошаговая работа с QSplitter

Первый шаг - Первым делом добавляем два объекта типа layout , в которых будут располагаться элементы интерфейса

Добавление двух layout

Второй шаг - Выбираем оба layout зажав Ctrl и кликаем по кнопке "Скомпоновать по горизонтали с разделителем", ну или "Скомпоновать по вертикали с разделителем", смотря кому, что нужно.

Компоновка layout с помощью QSplitter

Третий шаг - Растягиваем область, в которой располагается Наш QSplitter. Это необходимо в том случае, если внешний вид Вашего QSplitter повел себя не так, как Вам того хотелось. Для этого выбираем родительский виджет, в котором находится Ваш QSplitter и кликаем по кнопке "Скомпоновать по сетке". В итоге получим результат, подобный рисунку ниже.

Растягиваем область с QSplitter

Четвертый шаг - накидаем несколько объектов для наглядности.

Объекты в слоях

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

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    /* Устанавливаем параметры растяжения областей.
     * Области считаются слева направо.
     * в Методе setStretchFactor вначале устанавливается индекс
     * области, а потом её вес.
     * Таким образом первой области ставим максимальный вес,
     * а второй области минимальный.
     * */
    ui->splitter->setStretchFactor(0,1);
    ui->splitter->setStretchFactor(1,0);

    /* Также сразу хочу показать, как выбрать цвет разделителя.
     * Для это нам необходимо воспользоваться классом QPallete,
     * Для которого выбираем цвет фона.
     * */
    QPalette p;
    p.setColor(QPalette::Background, Qt::red);
    /* И устанавливаем палитру на QSplitter
     * */
    ui->splitter->setPalette(p);
}

MainWindow::~MainWindow()
{
    delete ui;
}

Итог

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

Приложение с разделителем
Рекомендуем хостинг TIMEWEB
Рекомендуем хостинг TIMEWEB
Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.
Поддержать автора Donate

Комментарии

Только авторизованные пользователи могут публиковать комментарии.
Пожалуйста, авторизуйтесь или зарегистрируйтесь
Donate

Здравствуйте, уважаемые пользователи EVILEG !!!

Если сайт вам помог, то поддержите разработку сайта финансово, пожалуйста.

Вы можете сделать это следующими способами:

Спасибо, Евгений Легоцкой

D
15 ноября 2019 г. 10:16
Daulet

C++ - Тест 004. Указатели, Массивы и Циклы

  • Результат:40баллов,
  • Очки рейтинга-8
ЛП
12 ноября 2019 г. 19:22
Лев Пархимович

C++ - Тест 006. Перечисления

  • Результат:50баллов,
  • Очки рейтинга-4
ЛП
12 ноября 2019 г. 18:35
Лев Пархимович

C++ - Тест 005. Структуры и Классы

  • Результат:66баллов,
  • Очки рейтинга-1
Последние комментарии
b
9 ноября 2019 г. 19:28
bastonc

спасибо ещё раз. огромное, за уделённое время
b
9 ноября 2019 г. 19:24
bastonc

Спасибо Вам большое. Буду изучать.
9 ноября 2019 г. 16:58
Евгений Легоцкой

Добрый день. По первым двум вопросам вы найдёте ответ в этой статье - PyQt5 - Урок 008. Работа с QTableWidget (Обновление урока 006) Что касается последнего вопроса, то я вам…
9 ноября 2019 г. 13:50
Евгений Легоцкой

Как и обещал, вы можете посмотреть новую статью QML - Урок 037. Кастомизация кнопок в QML (Обновление урока 002) . Там же найдёте ссылку на Git репозиторий. Не забудьте поставить звёз…
b
8 ноября 2019 г. 18:40
bastonc

Приветствую. Подскажите пожалуйста пару моментов. 1. Как сделать столбец не редактируемый, а остальные ячейки остаются редактируемыми 2. Как оталвливать события двойного клика для реда…
Сейчас обсуждают на форуме
15 ноября 2019 г. 15:06
Евгений Легоцкой

Что это такое Wrngdatalib ? Это namespace ? Скорее всего проблема в том, что те объекты тех классов, которые там присутствуют для обработки xml наследованы от QObject…
15 ноября 2019 г. 14:48
Евгений Легоцкой

Ну собственно поэтому я и сказал, что бесполезное это занятие.
15 ноября 2019 г. 14:27
Евгений Легоцкой

Добрый день. Вот эта статья кажется вполне подходящей к вашему вопросу Install OpenCV 3.4.4 on Ubuntu 16.04 (C++ and Python) Единственное, возможно, что вам потребуется ппра…
15 ноября 2019 г. 14:23
Евгений Легоцкой

Я нашёл решение от разработчиков PyQt5 в списке рассылки. os.environ['QT_QUICK_CONTROLS_STYLE'] = 'Material' Попробуйте его ещё
15 ноября 2019 г. 14:20
Евгений Легоцкой

Добрый день. Пробовали jintArray ?
EVILEG
О нас
Услуги
© EVILEG 2015-2019
Рекомендует хостинг TIMEWEB