Tutorial de PyQt5 - Etiqueta

  1. Widget de etiqueta PyQt5
  2. PyQt5 QLabel Establecer fuente
  3. Alineación de etiquetas PyQt5

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.

QLabel.py
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.

Etiqueta PyQt5

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.

QLabel_Set Font.py
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.

Fuente del conjunto de etiquetas de PyQt5

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.

Alineación de etiquetas PyQt5

comments powered by Disqus