I am interested in better understanding Qt and for that I would like to see how a relatively complex example of nested layouts and multiples widgets GUI is done solely programmatically; i.e. without the use of Qt Creator's Design.
I have seen several example code demonsrating only very simple layouts and -almost- always without utilising the header files; in fact most of the examples I have seen, dump the code in the main. It is my understanding (please correct me if I am wrong) that good programming practices dictate that you separate the design in a separate class (e.g. mainwindow
) and in the main.cpp
you merely invoke and show
that main window. Perhaps, most crucially, all the definitions of widgets, layouts etc. should be defined in the header file and then invoked and customised in the mainwindow.cpp
.
A fine exammple of good programming practices programmatically but for a relatively simple GUI desing can be seen here.
If anyone can provide online resource(s) where non-simple code examples of good programmatical GUI designs that show how to properly define and customise nested layouts and widgets that would be very much appreciated.
Alternatively, here is a straightforward programmatical GUI design example for which it would be great to derive code (without the Designer) for me to study and gain understanding from:
note: my focus is only on the nested layouts, multiple widgets and the where and how these should be defined and invoked on the different Qt source files.
where the nested layout and widget specifics can be seen here:
with the actual GUI result as seen here:
UPDATE
As Mike suggested in the comments section, from the uic the code for what the Designer does can be seen, which in my case for the example mentioned above is the following
>uic mainwindow.ui
outputs:
#ifndef UI_MAINWINDOW_H
#define UI_MAINWINDOW_H
#include <QtCore/QVariant>
#include <QtWidgets/QAction>
#include <QtWidgets/QApplication>
#include <QtWidgets/QButtonGroup>
#include <QtWidgets/QFormLayout>
#include <QtWidgets/QFrame>
#include <QtWidgets/QGridLayout>
#include <QtWidgets/QHBoxLayout>
#include <QtWidgets/QHeaderView>
#include <QtWidgets/QLabel>
#include <QtWidgets/QLineEdit>
#include <QtWidgets/QMainWindow>
#include <QtWidgets/QProgressBar>
#include <QtWidgets/QPushButton>
#include <QtWidgets/QSpacerItem>
#include <QtWidgets/QVBoxLayout>
#include <QtWidgets/QWidget>
QT_BEGIN_NAMESPACE
class Ui_MainWindow
{
public:
QWidget *centralWidget;
QVBoxLayout *verticalLayout_3;
QFrame *top_frame;
QGridLayout *gridLayout;
QSpacerItem *horizontalSpacer;
QProgressBar *progressBar_2;
QProgressBar *progressBar_4;
QSpacerItem *verticalSpacer;
QSpacerItem *horizontalSpacer_2;
QPushButton *pushButton_1;
QProgressBar *progressBar_1;
QPushButton *pushButton_2;
QPushButton *pushButton_3;
QProgressBar *progressBar_3;
QPushButton *pushButton_4;
QFrame *bottom_frame;
QHBoxLayout *horizontalLayout;
QFrame *frame;
QFormLayout *formLayout;
QLabel *label_1;
QLabel *label_2;
QSpacerItem *verticalSpacer_2;
QLineEdit *lineEdit;
QLineEdit *lineEdit_2;
QFrame *frame_2;
QHBoxLayout *horizontalLayout_2;
QLabel *label_3;
QSpacerItem *horizontalSpacer_3;
QLabel *label_4;
void setupUi(QMainWindow *MainWindow)
{
if (MainWindow->objectName().isEmpty())
MainWindow->setObjectName(QStringLiteral("MainWindow"));
MainWindow->resize(878, 632);
centralWidget = new QWidget(MainWindow);
centralWidget->setObjectName(QStringLiteral("centralWidget"));
verticalLayout_3 = new QVBoxLayout(centralWidget);
verticalLayout_3->setSpacing(6);
verticalLayout_3->setContentsMargins(11, 11, 11, 11);
verticalLayout_3->setObjectName(QStringLiteral("verticalLayout_3"));
top_frame = new QFrame(centralWidget);
top_frame->setObjectName(QStringLiteral("top_frame"));
QSizePolicy sizePolicy(QSizePolicy::Preferred, QSizePolicy::Expanding);
sizePolicy.setHorizontalStretch(0);
sizePolicy.setVerticalStretch(0);
sizePolicy.setHeightForWidth(top_frame->sizePolicy().hasHeightForWidth());
top_frame->setSizePolicy(sizePolicy);
top_frame->setFrameShape(QFrame::StyledPanel);
top_frame->setFrameShadow(QFrame::Raised);
gridLayout = new QGridLayout(top_frame);
gridLayout->setSpacing(6);
gridLayout->setContentsMargins(11, 11, 11, 11);
gridLayout->setObjectName(QStringLiteral("gridLayout"));
horizontalSpacer = new QSpacerItem(30, 20, QSizePolicy::Fixed, QSizePolicy::Minimum);
gridLayout->addItem(horizontalSpacer, 0, 2, 1, 1);
progressBar_2 = new QProgressBar(top_frame);
progressBar_2->setObjectName(QStringLiteral("progressBar_2"));
progressBar_2->setValue(24);
gridLayout->addWidget(progressBar_2, 2, 3, 1, 1);
progressBar_4 = new QProgressBar(top_frame);
progressBar_4->setObjectName(QStringLiteral("progressBar_4"));
progressBar_4->setValue(24);
gridLayout->addWidget(progressBar_4, 2, 5, 1, 1);
verticalSpacer = new QSpacerItem(20, 10, QSizePolicy::Minimum, QSizePolicy::Fixed);
gridLayout->addItem(verticalSpacer, 1, 1, 1, 1);
horizontalSpacer_2 = new QSpacerItem(10, 20, QSizePolicy::Fixed, QSizePolicy::Minimum);
gridLayout->addItem(horizontalSpacer_2, 0, 4, 1, 1);
pushButton_1 = new QPushButton(top_frame);
pushButton_1->setObjectName(QStringLiteral("pushButton_1"));
gridLayout->addWidget(pushButton_1, 0, 0, 1, 1);
progressBar_1 = new QProgressBar(top_frame);
progressBar_1->setObjectName(QStringLiteral("progressBar_1"));
progressBar_1->setValue(24);
gridLayout->addWidget(progressBar_1, 0, 3, 1, 1);
pushButton_2 = new QPushButton(top_frame);
pushButton_2->setObjectName(QStringLiteral("pushButton_2"));
gridLayout->addWidget(pushButton_2, 0, 1, 1, 1);
pushButton_3 = new QPushButton(top_frame);
pushButton_3->setObjectName(QStringLiteral("pushButton_3"));
gridLayout->addWidget(pushButton_3, 2, 0, 1, 1);
progressBar_3 = new QProgressBar(top_frame);
progressBar_3->setObjectName(QStringLiteral("progressBar_3"));
progressBar_3->setValue(24);
gridLayout->addWidget(progressBar_3, 0, 5, 1, 1);
pushButton_4 = new QPushButton(top_frame);
pushButton_4->setObjectName(QStringLiteral("pushButton_4"));
gridLayout->addWidget(pushButton_4, 2, 1, 1, 1);
verticalLayout_3->addWidget(top_frame);
bottom_frame = new QFrame(centralWidget);
bottom_frame->setObjectName(QStringLiteral("bottom_frame"));
bottom_frame->setFrameShape(QFrame::StyledPanel);
bottom_frame->setFrameShadow(QFrame::Raised);
horizontalLayout = new QHBoxLayout(bottom_frame);
horizontalLayout->setSpacing(6);
horizontalLayout->setContentsMargins(11, 11, 11, 11);
horizontalLayout->setObjectName(QStringLiteral("horizontalLayout"));
frame = new QFrame(bottom_frame);
frame->setObjectName(QStringLiteral("frame"));
frame->setFrameShape(QFrame::StyledPanel);
frame->setFrameShadow(QFrame::Raised);
formLayout = new QFormLayout(frame);
formLayout->setSpacing(6);
formLayout->setContentsMargins(11, 11, 11, 11);
formLayout->setObjectName(QStringLiteral("formLayout"));
label_1 = new QLabel(frame);
label_1->setObjectName(QStringLiteral("label_1"));
formLayout->setWidget(0, QFormLayout::LabelRole, label_1);
label_2 = new QLabel(frame);
label_2->setObjectName(QStringLiteral("label_2"));
formLayout->setWidget(1, QFormLayout::LabelRole, label_2);
verticalSpacer_2 = new QSpacerItem(20, 20, QSizePolicy::Minimum, QSizePolicy::Expanding);
formLayout->setItem(2, QFormLayout::LabelRole, verticalSpacer_2);
lineEdit = new QLineEdit(frame);
lineEdit->setObjectName(QStringLiteral("lineEdit"));
QSizePolicy sizePolicy1(QSizePolicy::Expanding, QSizePolicy::Expanding);
sizePolicy1.setHorizontalStretch(0);
sizePolicy1.setVerticalStretch(0);
sizePolicy1.setHeightForWidth(lineEdit->sizePolicy().hasHeightForWidth());
lineEdit->setSizePolicy(sizePolicy1);
formLayout->setWidget(3, QFormLayout::SpanningRole, lineEdit);
lineEdit_2 = new QLineEdit(frame);
lineEdit_2->setObjectName(QStringLiteral("lineEdit_2"));
sizePolicy1.setHeightForWidth(lineEdit_2->sizePolicy().hasHeightForWidth());
lineEdit_2->setSizePolicy(sizePolicy1);
formLayout->setWidget(4, QFormLayout::LabelRole, lineEdit_2);
horizontalLayout->addWidget(frame);
frame_2 = new QFrame(bottom_frame);
frame_2->setObjectName(QStringLiteral("frame_2"));
frame_2->setFrameShape(QFrame::StyledPanel);
frame_2->setFrameShadow(QFrame::Raised);
horizontalLayout_2 = new QHBoxLayout(frame_2);
horizontalLayout_2->setSpacing(6);
horizontalLayout_2->setContentsMargins(11, 11, 11, 11);
horizontalLayout_2->setObjectName(QStringLiteral("horizontalLayout_2"));
label_3 = new QLabel(frame_2);
label_3->setObjectName(QStringLiteral("label_3"));
horizontalLayout_2->addWidget(label_3);
horizontalSpacer_3 = new QSpacerItem(40, 20, QSizePolicy::Fixed, QSizePolicy::Minimum);
horizontalLayout_2->addItem(horizontalSpacer_3);
label_4 = new QLabel(frame_2);
label_4->setObjectName(QStringLiteral("label_4"));
horizontalLayout_2->addWidget(label_4);
frame->raise();
frame->raise();
label_3->raise();
label_4->raise();
horizontalLayout->addWidget(frame_2);
verticalLayout_3->addWidget(bottom_frame);
MainWindow->setCentralWidget(centralWidget);
retranslateUi(MainWindow);
QMetaObject::connectSlotsByName(MainWindow);
} // setupUi
void retranslateUi(QMainWindow *MainWindow)
{
MainWindow->setWindowTitle(QApplication::translate("MainWindow", "MainWindow", 0));
pushButton_1->setText(QApplication::translate("MainWindow", "PushButton_1", 0));
pushButton_2->setText(QApplication::translate("MainWindow", "PushButton_2", 0));
pushButton_3->setText(QApplication::translate("MainWindow", "PushButton_3", 0));
pushButton_4->setText(QApplication::translate("MainWindow", "PushButton_4", 0));
label_1->setText(QApplication::translate("MainWindow", "TextLabel_1", 0));
label_2->setText(QApplication::translate("MainWindow", "TextLabel_2", 0));
label_3->setText(QApplication::translate("MainWindow", "TextLabel_3", 0));
label_4->setText(QApplication::translate("MainWindow", "TextLabel_4", 0));
} // retranslateUi
};
namespace Ui {
class MainWindow: public Ui_MainWindow {};
} // namespace Ui
QT_END_NAMESPACE
#endif // UI_MAINWINDOW_H
Below is a transformation that you might wish to perform. I've included a shortened version of your code to demonstrate.
Start with
uic
output.Put all members of
Ui_Foo
intoFoo
itself, retaining their order.Change member types from pointers to values.
Initialize layouts in the class declaration by giving them the widgets they act on. This makes the structure of the user interface all obvious from the header itself:
Add code from
setupUi
to the constructor's body, changing it appropriately to act on values, not pointers: