How to use QVBoxLayout and QHBoxLayout in Qt

Comments

This is one of the most important article, who want to create an application because in a mobile, layout of the application and gizmo must be in proper way. Article shows two types of layout Horizontal and Vertical. To improve this article ,just make bold line in source code which are different from in both source code.

$ [--fasttrack 19:00, 12 September 2009 (UTC)]

---

Level: basic and helpful to beginners

This article has some basic information about Layout and which APIs are used to set Layout. Different types of layouts are also explained with code example.

This article shows the use of horizontal and vertical layout. And they are nice explained with code and snapshot. If you want to learn about form and grid layout, go through the following wiki articles:

How to use QGridLayout in Qt for Symbian

How to create a form using QFormLayout in Qt for Symbian

--vkmunjpara 21:42, 26 September 2009 (UTC)

---

---

Log in or Join to leave comments.

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