how to use QHBoxLayout and QVBoxLayout in PySdie2

-
it is very simple and easy to layout widgets with QH(V)BoxLayout.
in this page, I will introduce how to use them with example code.

have a look at below example code.


from PySide2.QtWidgets import QApplication, QVBoxLayout, QHBoxLayout, QPushButton, QWidget

app = QApplication([])

widget = QWidget()
btn1 = QPushButton("btn1")
btn2 = QPushButton("btn2")
btn3 = QPushButton("btn3")
btn4 = QPushButton("btn4")
btn5 = QPushButton("btn5")

hLayout = QHBoxLayout()
hLayout.addWidget(btn1)
hLayout.addWidget(btn2)
hLayout.addWidget(btn3)
hLayout.addWidget(btn4)
hLayout.addWidget(btn5)

widget.setLayout(hLayout)
widget.show()

app.exec_()


first of all, we have to import widgets that we will use. in this example code, I will use QApplication, QVBoxLayout, QHBoxLayout, QPushButton and QWidget. so I imported them. like below.


from PySide2.QtWidgets import QApplication, QVBoxLayout, QHBoxLayout, QPushButton, QWidget

and then, I created QApplication object. and I created QWidget object that will be our main window widget. every widget can have layout that arrange the children of the widget.


widget = QWidget()

I created 5 buttons. the constructor's parameter will be label of button.


btn1 = QPushButton("btn1")
btn2 = QPushButton("btn2")
btn3 = QPushButton("btn3")
btn4 = QPushButton("btn4")
btn5 = QPushButton("btn5")

I will add the button widgets to QHBoxLayout that arrange the widgets horizontally.


hLayout = QHBoxLayout()
hLayout.addWidget(btn1)
hLayout.addWidget(btn2)
hLayout.addWidget(btn3)
hLayout.addWidget(btn4)
hLayout.addWidget(btn5)

lastly, I set the QHBoxLayout to our main widget's layout. and then, I make the widget shown. finally, I execute the main loop by calling app.exec_()


widget.setLayout(hLayout)
widget.show()

app.exec_()

the result is like below.


the way to use QVBoxLayout is very similar to QHBoxLayout.
just modify the line that create QHBoxLayout object to QVBoxLayout.


hLayout = QVBoxLayout()

the result is like below








Comments

Post a Comment

Popular posts from this blog

making menubar and menu on QML

-
Image
Qt Quick Control module has ApplicationWindow object that has menubar, toolbar, footer and contents areas. in this page, I will introduce how to make menubar. first of all, we need application engine in python. so you can learn the way how to make the application object in python from  how to use Qt Quick Controls in PySdie2 we need simple window like below. import QtQuick 2.13 import QtQuick.Controls 2.13 ApplicationWindow { visible: true width: 720 height: 480 title: "simple window" } WindowApplication is invisible by default. so, we should set the visibility to true. and the properties that I used above are derived from QML Item object. ApplicationWindow has its own properties like below. activeFocusControl : Control background : Item contentData : list contentItem : Item font : font footer : Item header : Item locale : Locale menuBar : Item palette : palette we will focus on only menubar property of them in this pa
Read more

let's start QML programming with PySide2

-
Image
What is QML? QML is UI programming language. it is some like the structure of JSON format. QML is supported by QtQML module. In other words, it is based in Qt framework. QtQuick module includes QtQML module. and QtQuick includes visual components, model-view support, animation framework and other many components to build UI. What is strength of QML? QML is derived from Qt. using QML means using Qt. Qt is cross-platform framework. so, once you are familiar with Qt, you can make desktop, mobile(andorid and ios) and embedded GUI application with only Qt knowledge. and you can choose what you use for back-end with c++ and python. when learning new programming, it would be best way to print "Hello World". so, I will show you how to print "Hello World" with QML and Python. first of all, you should make .qml file. I made View.qml file for example. and then, just type like below code. //View.qml import QtQuick 2.0 Rectangle { width: 200 height
Read more

QSizePolicy Fixed example in pyside2

-
Image
when you set the size policy property of widget to QSizePolicy::Fixed,  the size of widget is fixed. even if the space of layout is changed, the size of widget is fixed. layout management of Qt manages the position and the size of nested widgets. but if any of widgets has fixed size policy, the widget is not handled by layout management. widget has setFixedSize() function. if you use this function, the maximum size and minimum size of widget is set to that value. let's check this behavior from example code. from PySide2 import QtWidgets app = QtWidgets . QApplication([]) window = QtWidgets . QWidget() layout = QtWidgets . QHBoxLayout() fixedSizedButton = QtWidgets . QPushButton( "Fixed Widget" ) print (fixedSizedButton . sizePolicy()) fixedSizedButton . setSizePolicy(QtWidgets . QSizePolicy . Fixed, QtWidgets . QSizePolicy . Fixed) layout . addWidget(fixedSizedButton) window . setLayout(layout) window . show() app . exec_() I created window widg
Read more