Qt: which layout or layout combination should I use in this case?

Question

I am working on a Qt project, and for this project I need to create something like this:

I have developed so far in Qt Creator, and I have a component, but when I try to add a widget to different layouts, I do not get the forms I need. What to do to resize my application?

Gate valves:

• The side panel has a fixed width, which means that with a horizontal increment of the window size, the width of the side panel of the side panel does not increase. The sidebar itself is a widget.
• the upper vertical width is fixed (if possible). This means that as the vertical size of the window increases, the top panel cannot become wider vertically. And he himself is also a widget.
• widgets on the side of the sidebar are in qstackedwidget.

Answer 1

Nested layouts:

(green square = QStackedWidget)

Steps:

[Definition]

H (x, y, ...) = horizontal layouts along x, y, ...; where x, y, ... is the widget (W #) or the layout (L #)

V (x, y, ...) = horizontal layouts along x, y, ...; where x, y, ... is the widget (W #) or the layout (L #)

• Step 1: V (W1, W2) = L1
• Step 2: H (W3, L1) = L2
• Step 3: V (W4, L2) = L3
• Step 4: Set L3 as the Layout of the Current StackedWidget Layout Page
• Step 5: H (W5, StackedWidget ) = L4
• 6: H (W6, , W7) = L5
• 7: V (L5, L4)

, W6 W7 ( ), spacer L5.

---

:

Answer 2

, , ...

#include "mainwindow.h"

#include <QBoxLayout>
#include <QLabel>
#include <QStackedWidget>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
// Ingredients (taken from the mockup from top-left to bottom-right)
QFrame *upperBar = new QFrame;
QLabel *upperIcon = new QLabel("icon");
QLabel *profilePicture = new QLabel("profile picture");

QFrame *sideBar = new QFrame;
QLabel *sideItemA = new QLabel("Item A");
QLabel *sideItemB = new QLabel("Item B");

QStackedWidget *contentStack = new QStackedWidget;

QFrame *contentPage1 = new QFrame;
QLabel *page1WidgetA = new QLabel("I am widget A");
QLabel *page1WidgetB = new QLabel("I am widget B");
QLabel *page1WidgetC = new QLabel("I am widget C");
QLabel *page1WidgetD = new QLabel("I am widget D");

QWidget *centralWidget = new QWidget;

// The needed layouts:
QHBoxLayout *upperBarLayout = new QHBoxLayout;
QVBoxLayout *sideBarLayout = new QVBoxLayout;
QGridLayout *page1GridLayout = new QGridLayout;
QGridLayout *centralLayout = new QGridLayout;

// Let connect the pieces:

/* First we setup the upperbar: */
upperBarLayout->addWidget(upperIcon, 1, Qt::AlignLeft);
upperBarLayout->addWidget(profilePicture, 3, Qt::AlignRight);
upperBar->setLayout(upperBarLayout);
upperBar->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Fixed);

/* Then we setup the sidebar: */
sideBarLayout->addWidget(sideItemA);
sideBarLayout->addWidget(sideItemB);
sideBarLayout->addStretch();
sideBar->setLayout(sideBarLayout);
sideBar->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Expanding);

/* Then we setup the content stacked widget */
page1GridLayout->addWidget(page1WidgetA, 0, 0, 3, 1);
page1GridLayout->addWidget(page1WidgetB, 0, 1, 1, 1);
page1GridLayout->addWidget(page1WidgetC, 1, 1, 2, 1);
page1GridLayout->addWidget(page1WidgetD, 3, 0, 1, 2);
contentPage1->setLayout(page1GridLayout);

contentStack->addWidget(contentPage1);
contentStack->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

/* Finally we setup the main elements into the central layout... */
centralLayout->addWidget(upperBar, 0, 0, 1, 2);
centralLayout->addWidget(sideBar, 1, 0, 1, 1);
centralLayout->addWidget(contentStack, 1, 1, 1, 1);
centralWidget->setLayout(centralLayout);
setCentralWidget(centralWidget);

/* Let color it a little to better realize the positioning: */
setStyleSheet("QWidget {"
              "border: 1px solid black;"
              "color: red"
              "}");
}

MainWindow::~MainWindow()
{

}

: