Master Quick Form Creation and Multi‑Page GUIs with PyQt Layouts

Quickly Create Forms: QFormLayout

If you need to build forms for entering data into a database, QFormLayout is ideal. It arranges widgets in two columns: the first column shows a label describing the expected input, and the second column holds input widgets such as QLineEdit, QComboBox, or QSpinBox.

To add widgets to a form layout, use .addRow(). The most common overloads are: .addRow(label, field) – adds a new row with a QLabel and an input widget. .addRow(labelText, field) – automatically creates a QLabel from the given text and adds the input widget.

Example application using QFormLayout:

import sys
from PyQt5.QtWidgets import (
    QApplication,
    QFormLayout,
    QLabel,
    QLineEdit,
    QWidget,
)

class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("QFormLayout Example")
        self.resize(270, 110)
        layout = QFormLayout()
        layout.addRow("Name:", QLineEdit())
        layout.addRow("Job:", QLineEdit())
        emailLabel = QLabel("Email:")
        layout.addRow(emailLabel, QLineEdit())
        self.setLayout(layout)

if __name__ == "__main__":
    app = QApplication(sys.argv)
    window = Window()
    window.show()
    sys.exit(app.exec_())

Running this code displays a window with a two‑column form where the left column contains labels and the right column contains editable fields.

Nested Layouts to Build Complex GUIs

Complex interfaces can be created by nesting layouts. Use .addLayout() on an outer layout to insert an inner layout as a child.

Example: a dialog with a form layout for labels and line edits, and a vertical layout below it for multiple checkboxes.

import sys
from PyQt5.QtWidgets import (
    QApplication,
    QCheckBox,
    QFormLayout,
    QLineEdit,
    QVBoxLayout,
    QWidget,
)

class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("Nested Layouts Example")
        outerLayout = QVBoxLayout()
        topLayout = QFormLayout()
        topLayout.addRow("Some Text:", QLineEdit())
        optionsLayout = QVBoxLayout()
        optionsLayout.addWidget(QCheckBox("Option one"))
        optionsLayout.addWidget(QCheckBox("Option two"))
        optionsLayout.addWidget(QCheckBox("Option three"))
        outerLayout.addLayout(topLayout)
        outerLayout.addLayout(optionsLayout)
        self.setLayout(outerLayout)

if __name__ == "__main__":
    app = QApplication(sys.argv)
    window = Window()
    window.show()
    sys.exit(app.exec_())

Multi‑Page Layouts and Widgets

When you need to show different sets of widgets based on user actions, use a multi‑page layout. PyQt provides QStackedLayout and convenient widgets like QTabWidget for this purpose.

Creating a Widget Stack

QStackedLayout

stacks widgets so that only one is visible at a time. Add widgets with .addWidget(), insert with .insertWidget(index), or remove with .removeWidget(widget). Switch pages by calling .setCurrentIndex().

import sys
from PyQt5.QtWidgets import (
    QApplication,
    QComboBox,
    QFormLayout,
    QLineEdit,
    QStackedLayout,
    QVBoxLayout,
    QWidget,
)

class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("QStackedLayout Example")
        layout = QVBoxLayout()
        self.setLayout(layout)
        self.pageCombo = QComboBox()
        self.pageCombo.addItems(["Page 1", "Page 2"]) 
        self.pageCombo.activated.connect(self.switchPage)
        self.stackedLayout = QStackedLayout()
        # Page 1
        self.page1 = QWidget()
        self.page1Layout = QFormLayout()
        self.page1Layout.addRow("Name:", QLineEdit())
        self.page1Layout.addRow("Address:", QLineEdit())
        self.page1.setLayout(self.page1Layout)
        self.stackedLayout.addWidget(self.page1)
        # Page 2
        self.page2 = QWidget()
        self.page2Layout = QFormLayout()
        self.page2Layout.addRow("Job:", QLineEdit())
        self.page2Layout.addRow("Department:", QLineEdit())
        self.page2.setLayout(self.page2Layout)
        self.stackedLayout.addWidget(self.page2)
        layout.addWidget(self.pageCombo)
        layout.addLayout(self.stackedLayout)

    def switchPage(self):
        self.stackedLayout.setCurrentIndex(self.pageCombo.currentIndex())

if __name__ == "__main__":
    app = QApplication(sys.argv)
    window = Window()
    window.show()
    sys.exit(app.exec_())

Using QTabWidget

QTabWidget

provides a tab bar and a page area. Add tabs with .addTab(page, label) or .addTab(page, icon, label). Each page is typically a QWidget containing its own layout and widgets.

import sys
from PyQt5.QtWidgets import (
    QApplication,
    QCheckBox,
    QTabWidget,
    QVBoxLayout,
    QWidget,
)

class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("QTabWidget Example")
        self.resize(270, 110)
        layout = QVBoxLayout()
        self.setLayout(layout)
        tabs = QTabWidget()
        tabs.addTab(self.generalTabUI(), "General")
        tabs.addTab(self.networkTabUI(), "Network")
        layout.addWidget(tabs)

    def generalTabUI(self):
        generalTab = QWidget()
        layout = QVBoxLayout()
        layout.addWidget(QCheckBox("General Option 1"))
        layout.addWidget(QCheckBox("General Option 2"))
        generalTab.setLayout(layout)
        return generalTab

    def networkTabUI(self):
        networkTab = QWidget()
        layout = QVBoxLayout()
        layout.addWidget(QCheckBox("Network Option 1"))
        layout.addWidget(QCheckBox("Network Option 2"))
        networkTab.setLayout(layout)
        return networkTab

if __name__ == "__main__":
    app = QApplication(sys.argv)
    window = Window()
    window.show()
    sys.exit(app.exec_())

Running the above code shows a dialog with two tabs—"General" and "Network"—each containing its own set of checkboxes.

Article originally sourced from the Python Chinese Community.