Tutorial de PyQt5 - Etiqueta
Aprenderemos a usar el widget de etiqueta PyQt5 QLabel
en este tutorial.
Widget de etiqueta PyQt5
Vamos a añadir dos etiquetas a nuestra ventana, donde una de ellas contendrá algún texto y la otra una imagen.
import sys
from PyQt5 import QtWidgets, QtGui
def basicWindow():
app = QtWidgets.QApplication(sys.argv)
windowExample = QtWidgets.QWidget()
labelA = QtWidgets.QLabel(windowExample)
labelB = QtWidgets.QLabel(windowExample)
labelA.setText("Label Example")
labelB.setPixmap(QtGui.QPixmap("python.jpg"))
windowExample.setWindowTitle("Label Example")
windowExample.setGeometry(100, 100, 300, 200)
labelA.move(100, 40)
labelB.move(120, 120)
windowExample.show()
sys.exit(app.exec_())
basicWindow()
Donde,
labelA = QtWidgets.QLabel(w)
La primera etiqueta labelA
es una QtWidgets.QtLabel
y la QtWidgets
- w
está entre paréntesis porque le dice al programa que la etiqueta labelA
se añade a la ventana w
.
labelA.setText("Label Example")
labelA.setText
establece el texto en la etiqueta.
windowExample.setGeometry(100, 100, 300, 200)
Establece el tamaño de la ventana en (300, 200)
y la coordenada de la esquina superior izquierda en (100, 100)
. Puedes consultar la explicación de setGeometry
en la última sección.
labelA.move(100, 40)
labelB.move(120, 120)
El método move()
mueve la etiqueta en la dirección de la derecha y hacia abajo. Al igual que labelA.move(100, 40)
mueve el labelA
a la coordenada de (100, 40)
relativa a la esquina superior izquierda de la ventana.
labelB.setPixmap(QtGui.QPixmap("globe.png"))
Muestra las imágenes en el labelB
. QPixmap es el módulo de QtGui y toma una imagen de Qt.
PyQt5 QLabel
Establecer fuente
En el ejemplo anterior, usamos la fuente por defecto en el widget de la etiqueta, y podrías especificar la fuente preferida como el tamaño, el peso y la familia de fuentes del texto de la etiqueta.
import sys
from PyQt5 import QtWidgets, QtGui
def basicWindow():
app = QtWidgets.QApplication(sys.argv)
windowExample = QtWidgets.QWidget()
labelA = QtWidgets.QLabel(windowExample)
labelB = QtWidgets.QLabel(windowExample)
labelA.setText("Times Font")
labelA.setFont(QtGui.QFont("Times", 12, QtGui.QFont.Bold))
labelB.setText("Arial Font")
labelB.setFont(QtGui.QFont("Arial", 14, QtGui.QFont.Black))
windowExample.setWindowTitle("Label Example")
windowExample.setGeometry(100, 100, 300, 200)
labelA.move(100, 40)
labelB.move(100, 120)
windowExample.show()
sys.exit(app.exec_())
basicWindow()
labelA.setFont(QtGui.QFont("Times", 12, QtGui.QFont.Bold))
El método setFont()
establece la fuente de la etiqueta. La clase QFont
especifica una fuente con atributos específicos.
Alineación de etiquetas PyQt5
El texto de la etiqueta está por defecto alineado al borde izquierdo, y esta propiedad puede ser modificada con el método QLabel.setAlignment()
.
import sys
from PyQt5 import QtWidgets, QtGui, QtCore
def basicWindow():
app = QtWidgets.QApplication(sys.argv)
windowExample = QtWidgets.QWidget()
labelLeft = QtWidgets.QLabel(windowExample)
labelRight = QtWidgets.QLabel(windowExample)
labelCenter = QtWidgets.QLabel(windowExample)
labelLeft.setText("Left Align")
labelRight.setText("Right Align")
labelCenter.setText("Center Align")
windowExample.setWindowTitle("Label Align Example")
windowExample.setGeometry(100, 100, 300, 200)
labelLeft.setFixedWidth(160)
labelRight.setFixedWidth(160)
labelCenter.setFixedWidth(160)
labelLeft.setStyleSheet("border-radius: 25px;border: 1px solid black;")
labelRight.setStyleSheet("border-radius: 25px;border: 1px solid black;")
labelCenter.setStyleSheet("border-radius: 25px;border: 1px solid black;")
labelLeft.setAlignment(QtCore.Qt.AlignLeft)
labelRight.setAlignment(QtCore.Qt.AlignRight)
labelCenter.setAlignment(QtCore.Qt.AlignCenter)
labelLeft.move(80, 40)
labelRight.move(80, 80)
labelCenter.move(80, 120)
windowExample.show()
sys.exit(app.exec_())
basicWindow()
labelLeft.setFixedWidth(160)
labelRight.setFixedWidth(160)
labelCenter.setFixedWidth(160)
Establece el ancho fijo de las tres etiquetas, en caso contrario, el ancho de la etiqueta se establece automáticamente de acuerdo con la longitud del texto de la etiqueta.
labelLeft.setStyleSheet("border-radius: 25px;border: 1px solid black;")
Podríamos usar una hoja de estilo similar a la de CSS para establecer los estilos de los widgets de PyQt5. Aquí, el borde de la etiqueta se establece en negro sólido con el borde de 1px, y el radio del borde se especifica como 25px.
labelLeft.setAlignment(QtCore.Qt.AlignLeft)
labelRight.setAlignment(QtCore.Qt.AlignRight)
labelCenter.setAlignment(QtCore.Qt.AlignCenter)
La propiedad de alineación del widget se establece por el método setAlignment
y sus opciones están en el módulo PyQt5.QtCore.Qt
, como
PyQt5.QtCore.Qt.AlignLeft
PyQt5.QtCore.Qt.AlignRight
PyQt5.QtCore.Qt.AlignCenter
Como se puede ver en la imagen de abajo, las etiquetas están alineadas de acuerdo a sus propiedades de alineación.
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