How to use QVBoxLayout and QHBoxLayout in Qt

Article Metadata

---

Tested with

Devices(s): Symbian emulator

---

Compatibility

Platform(s): Qt

---

Article

Keywords: QVBoxLayout,QHBoxLayout

Created: james1980 (27 Dec 2008)

Last edited: hamishwillee (11 Oct 2012)

Introduction

Qt supports several basic layouts in which you can arrange your widgets for display on the screen:

1. Vertical layout
2. Horizontal layout
3. Grid layout
4. Form layout

This article shows how to use two of the most useful layouts: QVBoxLayout and QVBoxLayout.

How to use QVBoxLayout

The QVBoxLayout class is used for vertical layouts.

Source code

#include <QApplication>
#include <QPushButton>
#include <QVBoxLayout>
 
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
QWidget* win = new QWidget();
QVBoxLayout* layout = new QVBoxLayout(win);
QPushButton* but1 = new QPushButton("Horizontal");
but1->resize(70,20);
layout->addWidget(but1);
QPushButton* but2 = new QPushButton("Vertical");
but2->resize(70,20);
layout->addWidget(but2);
 
win->show();
 
return app.exec();
}

Screen Shot

How to use QHBoxLayout

The class QHBoxLayout is used to arrange elements horizontally.

Source code

#include <QApplication>
#include <QPushButton>
#include <QHBoxLayout>
 
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
QWidget* win = new QWidget();
QHBoxLayout* layout = new QHBoxLayout(win);
QPushButton* but1 = new QPushButton("Horizontal");
but1->resize(70,20);
layout->addWidget(but1);
QPushButton* but2 = new QPushButton("Vertical");
but2->resize(70,20);
layout->addWidget(but2);
win->show();
 
return app.exec();
}

Screen Shot