In this Python PyQt5 lesson we are going to learn Python PyQt5 QVBoxLayout, basically there are different types of layout management that you can use in PyQt5.we have QVBoxLayout, QHBoxLayout and QGridLayout. particularly in this lesson we are talking about VBoxLayout, so by using vboxlayout you can align your widgets vertically. we create our layout in two ways, the first way is that we can do by coding and the second way is by using Qt Designer.
PyQt5 VBoxLayout by Coding
First we need to import our required classes and the important one is our QVBoxLayout, using PyQt5 QVBoxLayout class we can align our widgets vertically.
|
1 2 3 |
from PyQt5.QtWidgets import QApplication,QWidget, QVBoxLayout, QPushButton import sys from PyQt5.QtGui import QIcon |
These are used for creating title, icon and the geometry of the window, basically the geometry of the window is the x,y position, width and height of the window.
|
1 2 3 |
self.setGeometry(200,200, 400,300) self.setWindowTitle("PyQt5 VBoxLayout") self.setWindowIcon(QIcon('python.png')) |
This is the place that we have created our QVBoxLayout object.
|
1 |
vbox = QVBoxLayout() |
We are going to add four QPushButton in our VBoxLayout, first you need to create the object of QPushButton.
|
1 |
btn1 = QPushButton("Click One") |
After creating of your buttons, you need to add the buttons in VBoxLayout. you can use addWidget() method.
|
1 2 3 4 |
vbox.addWidget(btn1) vbox.addWidget(btn2) vbox.addWidget(btn3) vbox.addWidget(btn4) |
Now you need to set the layout for the main window, if you don’t do this you will not see any widgets in your window.
|
1 |
self.setLayout(vbox) |
This is the code for How to Create VBoxLayout in PyQt5
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
from PyQt5.QtWidgets import QApplication,QWidget, QVBoxLayout, QPushButton import sys from PyQt5.QtGui import QIcon class Window(QWidget): def __init__(self): super().__init__() #window title, icon and geometry self.setGeometry(200,200, 400,300) self.setWindowTitle("PyQt5 VBoxLayout") self.setWindowIcon(QIcon('python.png')) #vboxlayout object vbox = QVBoxLayout() #creating QPushButton btn1 = QPushButton("Click One") btn2 = QPushButton("Click Two") btn3 = QPushButton("Click Three") btn4 = QPushButton("Click Four") #add widgets in the layout vbox.addWidget(btn1) vbox.addWidget(btn2) vbox.addWidget(btn3) vbox.addWidget(btn4) #set the layout for the main window self.setLayout(vbox) app = QApplication(sys.argv) window = Window() window.show() sys.exit(app.exec_()) |
Run the complete code and this is the result
PyQt5 VBoxLayout By Qt Designer
Now we want to create our layout using Qt Designer , so you need to open your Qt Designer, you can write pyqt5designer in your terminal, after opening create a new Widget window. and add four QPushButton, after that select all buttons and right click on them choose Layout and Layout Vertically.
After doing this your all widgets will be aligned vertically, also you need to do the same for the window, right click on the window and choose layout vertically,save your ui file, iam going to call it vboxlayout.ui , and copy the file in your working directory.
now we are going to load our ui file. make a new python file and call it LoadVBox.py. we are going to use uic module for loading our ui file.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
from PyQt5.QtWidgets import QApplication, QWidget import sys from PyQt5 import uic class UI(QWidget): def __init__(self): super().__init__() uic.loadUi("vboxlayout.ui", self) app = QApplication([]) window = UI() window.show() app.exec_() |
Run the python code and this is the result.
