PyQt - QHBoxLayout



The QHBoxLayout is a class that constructs the layout container horizontally. The container is sequentially arranged from left to right. The creation of a horizontal layout uses various function of PyQt such as setLayout(), addWidget(), and addLayout(). Thus, the command of QHBoxLayout object create an active layout manager.

All these classes can be used as a step to build the container in horizontal direction −

Step 1 − Start creating a layout object from the layout class.

Step 2 − setLayout()- This is a layout object assigned to the parent widget property.

Step 3 − addWidget()- We can term this method as a calling function that can add widgets to the layout.

Step 4 − addLayout()- This is an additional method of QHBoxLayout class which allows us to create more complex widgets to PyQt window.

In this tutorial, we will explore how to use QHBoxlayout to arrange the PyQt widgets horizontally.

qhbox Layout Example One

Syntax of QHBoxLayout

The QHBoxLayout itself performs a class as well as a built-in function. Below the syntax performing the task of layout −

QHBoxLayout()

Usage of QHBoxLayout in PyQt Window

In the box layout system, the developer provides a robust method for positioning the GUI component with its application. Thus, three main usage of QHBoxLayout −

  • Create Widgets
  • Setup QHBoxLayout
  • Set the layout for window

Example

Following example illustrate the code of horizontal container layout using QHBoxLayout class.

import sys
from PyQt6.QtWidgets import QApplication, QWidget, QPushButton, QHBoxLayout
class ExampleWidget(QWidget):
   def __init__(self):
      super().__init__()
      self.initUI()
   def initUI(self):
      # Create widgets
      box1 = QPushButton('A', self)
      box2 = QPushButton('B', self)
      box3 = QPushButton('C', self)

      # Create horizontal layout
      h_box = QHBoxLayout()
      h_box.addWidget(box1)
      h_box.addWidget(box2)
      h_box.addWidget(box3)

      # Set the layout for the main window
      self.setLayout(h_box)

      self.setGeometry(300, 300, 300, 150)
      self.setWindowTitle('QHBoxLayout')
      self.show()

if __name__ == '__main__':
   app = QApplication(sys.argv)
   ex = ExampleWidget()
   sys.exit(app.exec())

Output

On executing the code, we get a result of horizontal container from left to right.

qhboxlayout Ex One.jpg

Margin and spacing property in QHBoxLayout

A margin property maintains the design of the PyQt window as it creates the space between the text and the edge of the container but space maintain the gap between two widgets.

We have two sets of property in PyQt window based on margin and space −

  • setSpacing() − This is an object which associate with QHBoxLayout class to set the space between child widgets.
  • setContentsMargins() − This property object also associated to QHBoxLayout class to build the margin by following four parameters − left, top, right, and bottom.

Example

In this example, we illustrate the property of space and margin using QHBoxLayout class and its object.

import sys
from PyQt6.QtWidgets import QApplication, QWidget, QPushButton, QHBoxLayout
class ExampleWidget(QWidget):
   def __init__(self):
      super().__init__()
      self.initUI()
   def initUI(self):
      # Create widgets
      b1 = QPushButton('A', self)
      b2 = QPushButton('B', self)
      b3 = QPushButton('C', self)

      # Create horizontal layout
      h_box = QHBoxLayout()
      h_box.addWidget(b1)
      h_box.addWidget(b2)
      h_box.addWidget(b3)

      # Set spacing between widgets
      h_box.setSpacing(70)

      # Set content margins
      h_box.setContentsMargins(50, 50, 50, 50)

      # Set the layout for the main window
      self.setLayout(h_box)

      self.setGeometry(300, 300, 300, 150)
      self.setWindowTitle('QHBoxLayout Margin')
      self.show()

if __name__ == '__main__':
   app = QApplication(sys.argv)
   ex = ExampleWidget()
   sys.exit(app.exec())

Output

The above code produces following output −

qhboxlayout Ex Two.jpg
Advertisements