Tutorial de PyQt5 - BoxLayout
-
Disposición de caja vertical -
QVBoxLayout
-
Caja horizontal -
QHBoxLayout
- Centro de alineación horizontal
Vamos a introducir la disposición de la QBox
como una disposición de caja horizontal, una disposición de caja vertical y los widgets de estiramiento.
Disposición de caja vertical - QVBoxLayout
import sys
from PyQt5 import QtWidgets
def basicWindow():
app = QtWidgets.QApplication(sys.argv)
windowExample = QtWidgets.QWidget()
buttonA = QtWidgets.QPushButton("Click!")
labelA = QtWidgets.QLabel("Label Example")
v_box = QtWidgets.QVBoxLayout()
v_box.addWidget(buttonA)
v_box.addWidget(labelA)
windowExample.setLayout(v_box)
windowExample.setWindowTitle("PyQt5 Lesson 4")
windowExample.show()
sys.exit(app.exec_())
basicWindow()
Dónde,
b = QtWidgets.QPushButton("Click!")
l = QtWidgets.QLabel("Label Example")
El QPushButton
y el QLabel
no se añaden a la ventana de la misma manera que lo hicimos en los últimos capítulos. Estos dos widgets se añadirán al diseño de la caja más tarde.
v_box = QtWidgets.QVBoxLayout()
Esto crea una disposición de caja vertical - QVBoxLayout
- en la que los widgets añadidos a esta disposición estarán alineados verticalmente donde el primer widget añadido está encima de otros widgets.
No hace nada por el momento porque es sólo un contenedor donde vamos a poner nuestros widgets.
v_box.addWidget(buttonA)
v_box.addWidget(lableA)
Añade el botón y la etiqueta a la disposición de la caja vertical v_box
.
Si ejecutamos este código, obtendremos el botón y la etiqueta uno debajo del otro.
Si cambias el tamaño de la ventana, verás que estos dos widgets ya no están alineados.
Cambiaremos nuestro código para que se vea mejor.
Caja horizontal - QHBoxLayout
import sys
from PyQt5 import QtWidgets
def basicWindow():
app = QtWidgets.QApplication(sys.argv)
windowExample = QtWidgets.QWidget()
buttonA = QtWidgets.QPushButton("Push Me")
labelA = QtWidgets.QLabel("Look at me")
h_box = QtWidgets.QHBoxLayout()
h_box.addStretch()
h_box.addWidget(labelA)
h_box.addStretch()
v_box = QtWidgets.QVBoxLayout()
v_box.addWidget(buttonA)
v_box.addLayout(h_box)
windowExample.setLayout(v_box)
windowExample.setWindowTitle("PyQt5 Lesson 4")
windowExample.show()
sys.exit(app.exec_())
basicWindow()
Dónde,
h_box = QtWidgets.QHBoxLayout()
Crea una disposición de caja horizontal.
h_box.addStretch()
h_box.addWidget(labelA)
h_box.addStretch()
El widget addStretch()
llena todo el espacio horizontal que puede. Dos tramos antes y después de la etiqueta ocupan tanto espacio como sea necesario para dejar la etiqueta justo en el medio de la caja horizontal.
Centro de alineación horizontal
Otra forma de alinear el widget en el centro es establecer la alineación del widget como AlignCenter
.
import sys
from PyQt5 import QtWidgets
from PyQt5 import QtCore
def basicWindow():
app = QtWidgets.QApplication(sys.argv)
windowExample = QtWidgets.QWidget()
buttonA = QtWidgets.QPushButton("Click!")
labelA = QtWidgets.QLabel("Label Example")
labelA.setAlignment(QtCore.Qt.AlignCenter)
v_box = QtWidgets.QVBoxLayout()
v_box.addWidget(buttonA)
v_box.addWidget(labelA)
windowExample.setLayout(v_box)
windowExample.setWindowTitle("AlignCenter Example")
windowExample.show()
sys.exit(app.exec_())
basicWindow()
Sólo añade dos líneas en comparación con el primer ejemplo anterior,
labelA.setAlignment(QtCore.Qt.AlignCenter)
El método setAlignment
establece la alineación del widget y QtCore.Qt.AlignCenter
son los parámetros de alineación del centro del módulo QtCore
que deben ser importados al código.
Tiene exactamente el mismo diseño que el ejemplo anterior.
Founder of DelftStack.com. Jinku has worked in the robotics and automotive industries for over 8 years. He sharpened his coding skills when he needed to do the automatic testing, data collection from remote servers and report creation from the endurance test. He is from an electrical/electronics engineering background but has expanded his interest to embedded electronics, embedded programming and front-/back-end programming.
LinkedIn Facebook