Basic Qt Programming: Multiple widgets on a window

Multiple widgets

We can connect two Qt widgets through signal slot mechanism.  Also an introduction to QWidget and QLayout.

We are going to make a simple window having a text edit line and a label which will show whatever text entered by user. In last example we used only one widget that was QPushButton.  Now two new widgets QLineEdit for text edit line and QLabel for text label will be used. If we go through the pattern of last example and code as :

#include <QApplication>

#include <QLineEdit>

#include <QLabel>

int main(int argc, char *argv[])

{

    QApplication a(argc, argv);

    QLineEdit * lineEdit = new QLineEdit("Write here");

    QLabel * label = new QLabel();

      QObject::connect(lineEdit,SIGNAL(textChanged(QString)), label, SLOT(setText(QString)));

    lineEdit->show();

    label->show();

    return a.exec();

}

You will get some odd results.

What we need should appear in a single window. So to get more than one widget on a single window we have to use QWidget it provide a plane window on which we can put multiple Qt widgets or I can say group those in one.

We will create a QWidget and then make it parent of all other widgets that we want to be on a single window.

Now my code became as:

#include <QApplication>

#include <QWidget>

#include <QLineEdit>

#include <QLabel>

int main(int argc, char *argv[])

{

    QApplication a(argc, argv); 

// Making parent widget

    QWidget * widget = new QWidget;

//arguemnt of constructor defining widget as a parent of line Edit

    QLineEdit * lineEdit = new QLineEdit("Writehere",widget);

    QLabel * label = new QLabel(widget);

    QObject::connect(lineEdit,SIGNAL(textChanged(QString)),label,SLOT(setText(QString)));

    widget->show();//Showing parent will show all its childern

    return a.exec();

}

When you run this you can see both widgets  coming together but they are overlapped. Here the need of layout come. So we have to make a layout. Here we are going to use QVBoxLayout which will provide arrangement of widgets vertically you can use QHBoxLayout for horizontal arrangement. We can add widgets in the layout and then add that layout to the widget.

A QWidget allow to set single layout.

So our code became now:

#include <QApplication>

#include <QLineEdit>

#include <QLabel>

#include <QVBoxLayout>

#include <QWidget>

int main(int argc, char *argv[])

{

    QApplication a(argc, argv);

    QWidget * widget = new QWidget;

    QVBoxLayout * layout = new QVBoxLayout;

    QLineEdit * lineEdit = new QLineEdit("Write here",widget);

    QLabel * label = new QLabel(widget);

    layout->addWidget(lineEdit);

    layout->addWidget(label);

   widget->setLayout(layout);

    QObject::connect(lineEdit,SIGNAL(textChanged(QString)), label,SLOT(setText(QString)));

    widget->show();

    return a.exec();

}

Here we get final results. Here if you remove parent of label and lineEdit they will still appear on window cause through layout they are now inside window.

Now try these:

1. Add these lines one by one before setLayout function call and see what changes came due to each. Also try with changing their values.

    layout->setMargin(55);

   layout->setStretch(0,1);

   layout->setSpacing(50);