PyQt6: Using QLabel – Displaying Text and Images

You are currently viewing PyQt6: Using QLabel – Displaying Text and Images

PyQt6: Using QLabel – Displaying Text and Images

QLabel is one of the most versatile and frequently used widgets in PyQt6, providing an easy way to display text and images in your applications. Whether you’re creating a simple status message or a complex layout with images and styled text, QLabel is an essential tool in your PyQt6 toolkit.

In this article, we’ll delve into the various features of QLabel, from the basics of displaying simple text to more advanced uses like combining text and images, applying styles, and handling events. By the end of this guide, you’ll have a solid understanding of how to effectively use QLabel to enhance your PyQt6 applications.

We’ll start by setting up our development environment and creating a basic QLabel. From there, we’ll explore how to customize text, display images, and combine text and images in a single label. We’ll also cover styling QLabel with Qt Style Sheets, handling events to make QLabel interactive, and using advanced features like rich text and image scaling.

Setting Up the Development Environment

Before we dive into using QLabel in PyQt6, we need to set up our development environment. This includes installing Python and PyQt6, and ensuring we have everything ready to start writing and running PyQt6 applications.

Installing Python and PyQt6

  1. Install Python: Make sure you have Python installed on your computer. PyQt6 requires Python 3.6 or later. You can download the latest version of Python from the official Python website.
  2. Install PyQt6: Once Python is installed, open your command prompt or terminal and install PyQt6 using the pip package manager. Run the following command: 
pip install PyQt6

    This command will download and install PyQt6 along with all its dependencies.

    Setting Up a Development Environment

    To write and run your PyQt6 code, you can use any text editor or Integrated Development Environment (IDE). Some popular choices include:

    • PyCharm: A powerful IDE for Python with support for PyQt6.
    • VS Code: A lightweight and versatile code editor with Python extensions.
    • Sublime Text: A simple yet efficient text editor.

    Choose the one that you’re most comfortable with.

    Writing a Simple PyQt6 Application

    To ensure everything is set up correctly, let’s write a simple PyQt6 application that creates a window with a QLabel displaying some text.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named simple_label.py.
    2. Write the Basic Code: Copy and paste the following code into your simple_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('PyQt6 QLabel Example')
window.setGeometry(100, 100, 400, 200)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance
label = QLabel('Hello, PyQt6!', window)
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window appear with a label displaying the text “Hello, PyQt6!”.

    In this code, we start by importing the necessary modules: sys for system-level interactions and QApplication, QWidget, QLabel, and QVBoxLayout from PyQt6 for creating the application, the main window, the label, and the layout, respectively.

    We then create an instance of QApplication to manage application-wide resources. This is followed by creating an instance of QWidget, which serves as the main window of the application. We set the title and size of the window using setWindowTitle and setGeometry.

    Next, we create a QLabel with the text “Hello, PyQt6!” and add it to a QVBoxLayout. Finally, we set the layout for the main window, show the window, and start the application’s event loop with sys.exit(app.exec()).

    By following these steps, you’ve successfully set up your development environment and created a simple PyQt6 application. In the next sections, we’ll explore how to customize QLabel, display images, and use more advanced features.

    Creating a Basic QLabel

    Now that our development environment is set up, let’s start by creating a basic QLabel in PyQt6. QLabel is a versatile widget that can display both text and images. In this section, we’ll create a simple window with a QLabel displaying some text.

    Introduction to QLabel

    QLabel is a widget that provides a way to display text or images in your PyQt6 application. It is commonly used for labels, titles, and images in the user interface. QLabel is straightforward to use and can be easily customized to suit your needs.

    Code Example: Creating a Window with a Basic Text Label

    Let’s create a simple PyQt6 application with a window that contains a single QLabel displaying the text “Hello, PyQt6!”.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named basic_label.py.
    2. Write the Code: Copy and paste the following code into your basic_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Basic QLabel Example')
window.setGeometry(100, 100, 400, 200)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance
label = QLabel('Hello, PyQt6!', window)
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window appear with a label displaying the text “Hello, PyQt6!”.

    By following these steps, you’ve created a basic PyQt6 application with a QLabel. In the next sections, we’ll explore how to customize the text in QLabel, display images, and combine text and images in a single label.

    Customizing Text in QLabel

    QLabel provides various options to customize the text it displays, allowing you to create labels that fit the style and functionality of your application. In this section, we’ll explore how to change the label text, adjust alignment, and set font properties such as size, family, and style.

    Changing Label Text and Alignment

    You can change the text displayed by a QLabel using the setText method. Additionally, QLabel provides several alignment options to position the text within the label. You can use the setAlignment method to specify the text alignment.

    Here’s an example that demonstrates how to change the text and align it to the center:

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named custom_text_label.py.
    2. Write the Code: Copy and paste the following code into your custom_text_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout
from PyQt6.QtCore import Qt

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Custom Text QLabel Example')
window.setGeometry(100, 100, 400, 200)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance
label = QLabel('Hello, PyQt6!', window)
label.setAlignment(Qt.AlignmentFlag.AlignCenter)  # Align text to the center
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window appear with a label displaying the text “Hello, PyQt6!” centered in the window.

    Setting Font Properties

    You can customize the font properties of the text displayed in QLabel using the setFont method. This method allows you to specify the font family, size, weight, and style. The following example demonstrates how to set these properties:

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named custom_font_label.py.
    2. Write the Code: Copy and paste the following code into your custom_font_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout
from PyQt6.QtGui import QFont
from PyQt6.QtCore import Qt

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Custom Font QLabel Example')
window.setGeometry(100, 100, 400, 200)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance
label = QLabel('Hello, PyQt6!', window)
label.setAlignment(Qt.AlignmentFlag.AlignCenter)  # Align text to the center

# Set font properties
font = QFont('Arial', 24, QFont.Weight.Bold)
label.setFont(font)

layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window with a label displaying the text “Hello, PyQt6!” in bold Arial font with a size of 24 points, centered in the window.

    Explanation of Key Components

    Changing Text:

    • Use the setText method to change the text displayed by QLabel. label.setText('New Text')

    Aligning Text:

    • Use the setAlignment method to align text within QLabel. Common alignment flags include Qt.AlignmentFlag.AlignLeft, Qt.AlignmentFlag.AlignRight, Qt.AlignmentFlag.AlignTop, Qt.AlignmentFlag.AlignBottom, and Qt.AlignmentFlag.AlignCenter. python label.setAlignment(Qt.AlignmentFlag.AlignCenter)

    Setting Font Properties:

    • Create a QFont object and set its properties such as family, size, and weight. Use the setFont method to apply the font to QLabel. 
    font = QFont('Arial', 24, QFont.Weight.Bold)
label.setFont(font)

    By customizing the text and font properties of QLabel, you can create labels that are both functional and visually appealing, matching the design and style of your application. In the next section, we’ll explore how to display images in QLabel.

    Displaying Images in QLabel

    QLabel is not only useful for displaying text but also for displaying images. This versatility makes it a key component in creating visually rich applications. In this section, we’ll explore how to load and display images using QLabel.

    Introduction to Displaying Images

    QLabel supports various image formats such as PNG, JPEG, BMP, and more. To display an image, you need to load it using the QPixmap class and set it on the QLabel.

    Supported Image Formats

    QLabel can handle many standard image formats, including:

    • PNG (.png)
    • JPEG (.jpg, .jpeg)
    • BMP (.bmp)
    • GIF (.gif)
    • TIFF (.tiff)

    Code Example: Loading and Displaying an Image in QLabel

    Let’s create a simple PyQt6 application with a window that contains a QLabel displaying an image. Ensure you have an image file named example.png (or any other supported format) in the same directory as your script, or update the file path accordingly.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named image_label.py.
    2. Write the Code: Copy and paste the following code into your image_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout
from PyQt6.QtGui import QPixmap

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('QLabel Image Example')
window.setGeometry(100, 100, 400, 300)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance
label = QLabel(window)

# Load an image using QPixmap
pixmap = QPixmap('example.png')
label.setPixmap(pixmap)

# Add the label to the layout
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window appear with a QLabel displaying the image example.png.

    Handling Different Image Paths

    If your image is located in a different directory, provide the full path to the image file:

    pixmap = QPixmap('/path/to/your/image.png')
label.setPixmap(pixmap)

    Resizing Images to Fit QLabel

    Sometimes, the image might be too large or too small for the QLabel. You can resize the image to fit the QLabel using the scaled method of QPixmap:

    pixmap = QPixmap('example.png')
scaled_pixmap = pixmap.scaled(label.size(), aspectRatioMode=Qt.AspectRatioMode.KeepAspectRatio)
label.setPixmap(scaled_pixmap)

    This ensures that the image maintains its aspect ratio while fitting within the QLabel.

    By displaying images in QLabel, you can enhance the visual appeal of your PyQt6 applications. In the next section, we’ll explore how to combine text and images in a single QLabel.

    Combining Text and Images in QLabel

    QLabel’s versatility allows you to display both text and images simultaneously, creating rich and informative UI elements. In this section, we’ll explore how to combine text and images in a single QLabel to make your PyQt6 applications more visually appealing and informative.

    Adding Text and Images Together

    To display both text and images in QLabel, you can use HTML. QLabel supports basic HTML formatting, which enables you to combine text and images in a single label. This is particularly useful for creating detailed UI elements like informational labels, product descriptions, or status messages.

    Code Example: Combining Text and Images in a Single QLabel

    Let’s create a PyQt6 application with a QLabel that displays both text and an image.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named text_image_label.py.
    2. Write the Code: Copy and paste the following code into your text_image_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout
from PyQt6.QtCore import Qt

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('QLabel Text and Image Example')
window.setGeometry(100, 100, 400, 300)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance with HTML content
label = QLabel(window)
label.setAlignment(Qt.AlignmentFlag.AlignCenter)

# Define HTML content with text and image
html_content = """
<h1>Welcome to PyQt6</h1>
<p>This is an example of QLabel displaying both text and an image.</p>
<img src="example.png" width="200" height="100">
"""

# Set the HTML content to the label
label.setText(html_content)

# Add the label to the layout
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window with a QLabel displaying a heading, a paragraph of text, and an image.

    Customizing the HTML Content

    You can customize the HTML content to fit your needs. Here are a few additional HTML elements you can use:

    • Text Formatting: Use <b> for bold text, <i> for italic text, and <u> for underlined text.
      <b>Bold Text</b>
  <i>Italic Text</i>
  <u>Underlined Text</u>

    • Lists: Create ordered and unordered lists using <ol> and <ul>.
      <ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
  </ul>

    • Tables: Create tables using <table>, <tr>, <td>, and <th>.
      <table border="1">
    <tr>
      <th>Header 1</th>
      <th>Header 2</th>
    </tr>
    <tr>
      <td>Data 1</td>
      <td>Data 2</td>
    </tr>
  </table>

    By leveraging QLabel’s support for HTML, you can create labels that display rich content, combining text and images seamlessly. This enhances the user interface and provides more context and information to the users. In the next section, we’ll explore how to style QLabel with Qt Style Sheets to further customize its appearance.

    Styling QLabel with Qt Style Sheets

    Styling your QLabel widgets can significantly enhance the visual appeal of your PyQt6 applications. Qt Style Sheets (QSS) allow you to customize the appearance of QLabel, enabling you to change its background color, border, font, and more. In this section, we’ll explore how to apply styles to QLabel using Qt Style Sheets.

    Introduction to Styling with QSS

    Qt Style Sheets provide a way to apply CSS-like styling to Qt widgets. This allows you to define the look and feel of your application in a flexible and maintainable manner. With QSS, you can control various aspects of QLabel’s appearance, including colors, fonts, borders, and padding.

    Applying Styles to QLabel

    You can apply styles to a QLabel by using the setStyleSheet method. This method takes a string containing the style rules and applies them to the widget.

    Code Example: Customizing Button Appearance with Styles

    Let’s create a PyQt6 application with a QLabel that has customized styles.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named styled_label.py.
    2. Write the Code: Copy and paste the following code into your styled_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout
from PyQt6.QtCore import Qt

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Styled QLabel Example')
window.setGeometry(100, 100, 400, 200)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance
label = QLabel('Hello, PyQt6!', window)
label.setAlignment(Qt.AlignmentFlag.AlignCenter)  # Align text to the center

# Apply styles to the label
label.setStyleSheet("""
QLabel {
   background-color: #f0f0f0;  /* Light gray background */
   color: #007ACC;  /* Blue text color */
   border: 2px solid #007ACC;  /* Blue border */
   border-radius: 10px;  /* Rounded corners */
   font-size: 20px;  /* Font size */
   padding: 10px;  /* Padding */
}
""")

# Add the label to the layout
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window with a QLabel that has a light gray background, blue text, a blue border with rounded corners, and additional padding.

    Explanation of the Style Rules

    • Background Color:
      background-color: #f0f0f0;

    This sets the background color of the QLabel to light gray.

    • Text Color:
      color: #007ACC;

    This sets the text color to blue.

    • Border:
      border: 2px solid #007ACC;

    This defines a 2-pixel solid blue border around the QLabel.

    • Border Radius:
      border-radius: 10px;

    This rounds the corners of the QLabel with a radius of 10 pixels.

    • Font Size:
      font-size: 20px;

    This sets the font size to 20 pixels.

    • Padding:
      padding: 10px;

    This adds 10 pixels of padding inside the QLabel, providing space between the text and the border.

    Additional Styling Options

    You can further customize QLabel with additional style properties, such as:

    • Font Family:
      font-family: 'Arial', sans-serif;

    This sets the font family to Arial.

    • Text Alignment: You can align text using the text-align property. However, QLabel already provides alignment through the setAlignment method, which is recommended for use in PyQt6.
    • Hover and Focus States:
      You can define styles for hover and focus states to provide visual feedback when the user interacts with the QLabel.
      QLabel:hover {
      background-color: #e0e0e0;  /* Lighter gray on hover */
  }

  QLabel:focus {
      border: 2px solid #FF0000;  /* Red border when focused */
  }

    By using Qt Style Sheets, you can create visually appealing QLabel widgets that enhance the user interface of your PyQt6 applications. Experiment with different styles and properties to achieve the desired look and feel for your application. In the next section, we’ll explore how to handle events with QLabel to make it interactive.

    Handling Events with QLabel

    While QLabel is primarily used for displaying text and images, it can also be made interactive by handling events. By making QLabel respond to user interactions such as mouse clicks or hovering, you can enhance the functionality of your application. In this section, we’ll explore how to handle events with QLabel to make it interactive.

    Introduction to Event Handling

    Event handling allows your application to respond to various user actions, such as mouse clicks, key presses, and other interactions. QLabel, like other PyQt6 widgets, can emit signals when specific events occur. By connecting these signals to custom slot functions, you can define how your application should respond to these events.

    Making QLabel Interactive

    To handle events with QLabel, you can subclass QLabel and override event handler methods such as mousePressEvent, mouseReleaseEvent, and enterEvent. Additionally, you can make QLabel emit custom signals in response to events.

    Code Example: Handling Mouse Click Events

    Let’s create a PyQt6 application with a custom QLabel that changes its text when clicked.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named interactive_label.py.
    2. Write the Code: Copy and paste the following code into your interactive_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout
from PyQt6.QtCore import Qt


class ClickableLabel(QLabel):
    def __init__(self, text, parent=None):
        super().__init__(text, parent)
        self.setAlignment(Qt.AlignmentFlag.AlignCenter)
        self.setStyleSheet("""
           QLabel {
               background-color: #f0f0f0;
               color: #007ACC;
               border: 2px solid #007ACC;
               border-radius: 10px;
               font-size: 20px;
               padding: 10px;
           }
           QLabel:hover {
               background-color: #e0e0e0;
           }
       """)

    def mousePressEvent(self, event):
        self.setText("Label Clicked!")
        self.setStyleSheet("""
           QLabel {
               background-color: #FF6347;
               color: white;
               border: 2px solid #FF6347;
               border-radius: 10px;
               font-size: 20px;
               padding: 10px;
           }
       """)


# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Interactive QLabel Example')
window.setGeometry(100, 100, 400, 200)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create an instance of ClickableLabel
label = ClickableLabel('Click Me', window)

# Add the label to the layout
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window with a QLabel displaying “Click Me”. When you click the label, the text changes to “Label Clicked!” and the background color changes to a reddish color.

    Handling Other Events

    In addition to mouse click events, you can handle other events such as mouse release, enter, and leave events by overriding the corresponding methods:

    • Mouse Release Event:
    def mouseReleaseEvent(self, event):
  self.setText("Mouse Released!")

    • Enter Event:
    def enterEvent(self, event):
  self.setText("Mouse Entered!")

    • Leave Event:
    def leaveEvent(self, event):
  self.setText("Mouse Left!")

    By making QLabel interactive and responding to user events, you can enhance the functionality and user experience of your PyQt6 applications. Experiment with different events and custom behaviors to create rich, interactive interfaces. In the next section, we’ll explore advanced QLabel features such as using rich text (HTML) and scaling images to fit the label.

    Advanced QLabel Features

    QLabel offers several advanced features that can help you create more sophisticated and user-friendly applications. These features include displaying rich text using HTML and scaling images to fit within the QLabel. In this section, we’ll explore these advanced QLabel features with practical examples.

    Using QLabel for Rich Text (HTML)

    QLabel supports HTML content, allowing you to display rich text with formatting, links, images, and more. This feature is useful for creating complex and visually appealing labels.

    Code Example: Displaying Rich Text

    Let’s create a PyQt6 application that uses QLabel to display formatted text with HTML.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named rich_text_label.py.
    2. Write the Code: Copy and paste the following code into your rich_text_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout
from PyQt6.QtCore import Qt

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Rich Text QLabel Example')
window.setGeometry(100, 100, 400, 300)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance with HTML content
label = QLabel(window)
label.setAlignment(Qt.AlignmentFlag.AlignCenter)

# Define HTML content with rich text
html_content = """
<h1 style="color: #007ACC;">Welcome to PyQt6</h1>
<p>This is an example of <b>QLabel</b> displaying <i>rich text</i> with <a href='https://www.qt.io/'>links</a> and images.</p>
<img src="example.png" width="200" height="100">
"""

# Set the HTML content to the label
label.setText(html_content)

# Enable interaction with links
label.setOpenExternalLinks(True)

# Add the label to the layout
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())
    1. Run the Script: Save your file and run it. You should see a window with a QLabel displaying a heading, formatted text, a clickable link, and an image.

    Scaling Images to Fit QLabel

    Sometimes, the image might not fit perfectly within the QLabel. You can scale the image to fit the QLabel using the scaled method of QPixmap.

    Code Example: Scaling an Image

    Let’s modify our previous example to scale the image to fit within the QLabel.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named scaled_image_label.py.
    2. Write the Code: Copy and paste the following code into your scaled_image_label.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout
from PyQt6.QtGui import QPixmap
from PyQt6.QtCore import Qt

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Scaled Image QLabel Example')
window.setGeometry(100, 100, 400, 300)

# Create a QVBoxLayout instance
layout = QVBoxLayout()

# Create a QLabel instance
label = QLabel(window)
label.setAlignment(Qt.AlignmentFlag.AlignCenter)

# Load and scale the image
pixmap = QPixmap('example.png')
scaled_pixmap = pixmap.scaled(200, 100, Qt.AspectRatioMode.KeepAspectRatio)
label.setPixmap(scaled_pixmap)

# Add the label to the layout
layout.addWidget(label)

# Set the layout for the main window
window.setLayout(layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window with a QLabel displaying the scaled image.

    By utilizing QLabel’s advanced features, such as displaying rich text with HTML and scaling images, you can create more sophisticated and user-friendly PyQt6 applications. Experiment with these features to enhance the visual appeal and functionality of your labels. In the next section, we’ll explore how to integrate QLabel with other widgets to create complex layouts.

    Integrating QLabel with Other Widgets

    Integrating QLabel with other widgets is essential for creating comprehensive and interactive user interfaces in your PyQt6 applications. By combining QLabel with layout managers and other PyQt6 widgets, you can build complex and responsive interfaces. This section will guide you through the process of integrating QLabel with other widgets and demonstrate how to create a user-friendly form layout.

    Combining QLabel with Other Widgets in Layouts

    To create well-organized interfaces, you need to use layout managers like QVBoxLayout, QHBoxLayout, and QGridLayout. These layout managers help you arrange widgets systematically within the main window. In this example, we’ll use a form layout to integrate QLabel with other widgets such as QLineEdit and QPushButton.

    Code Example: Using QLabel in a Form Layout

    Let’s create a simple form with labels, line edits for user input, and a submit button.

    1. Create a New Python File: Open your IDE or text editor and create a new Python file named form_layout.py.
    2. Write the Code: Copy and paste the following code into your form_layout.py file:
    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QLineEdit, QPushButton, QVBoxLayout, QHBoxLayout, QFormLayout


# Slot function to handle button click
def on_submit():
    name = name_input.text()
    email = email_input.text()
    print(f'Name: {name}, Email: {email}')


# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Form Layout Example')
window.setGeometry(100, 100, 400, 200)

# Create a QFormLayout instance
form_layout = QFormLayout()

# Create QLabel and QLineEdit instances for name
name_label = QLabel('Name:')
name_input = QLineEdit()

# Create QLabel and QLineEdit instances for email
email_label = QLabel('Email:')
email_input = QLineEdit()

# Add widgets to the form layout
form_layout.addRow(name_label, name_input)
form_layout.addRow(email_label, email_input)

# Create a QHBoxLayout for the button
button_layout = QHBoxLayout()
submit_button = QPushButton('Submit')
submit_button.clicked.connect(on_submit)
button_layout.addWidget(submit_button)

# Create a QVBoxLayout to combine the form layout and button layout
main_layout = QVBoxLayout()
main_layout.addLayout(form_layout)
main_layout.addLayout(button_layout)

# Set the layout for the main window
window.setLayout(main_layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    1. Run the Script: Save your file and run it. You should see a window with a form containing labels, text input fields, and a submit button. When you enter text in the fields and click the submit button, the input values are printed in the console.

    Creating More Complex Layouts

    By integrating multiple widgets and layout managers, you can create more complex and interactive user interfaces. For instance, you can add additional buttons, input fields, and other widgets to enhance the functionality of your form. Here’s an example with additional buttons:

    import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QLineEdit, QPushButton, QVBoxLayout, QHBoxLayout, QFormLayout

# Slot function to handle button click
def on_submit():
    name = name_input.text()
    email = email_input.text()
    print(f'Name: {name}, Email: {email}')

def on_clear():
    name_input.clear()
    email_input.clear()

# Create an instance of QApplication
app = QApplication(sys.argv)

# Create a QWidget instance (main window)
window = QWidget()
window.setWindowTitle('Extended Form Layout Example')
window.setGeometry(100, 100, 400, 200)

# Create a QFormLayout instance
form_layout = QFormLayout()

# Create QLabel and QLineEdit instances for name
name_label = QLabel('Name:')
name_input = QLineEdit()

# Create QLabel and QLineEdit instances for email
email_label = QLabel('Email:')
email_input = QLineEdit()

# Add widgets to the form layout
form_layout.addRow(name_label, name_input)
form_layout.addRow(email_label, email_input)

# Create a QHBoxLayout for the buttons
button_layout = QHBoxLayout()
submit_button = QPushButton('Submit')
submit_button.clicked.connect(on_submit)
clear_button = QPushButton('Clear')
clear_button.clicked.connect(on_clear)
button_layout.addWidget(submit_button)
button_layout.addWidget(clear_button)

# Create a QVBoxLayout to combine the form layout and button layout
main_layout = QVBoxLayout()
main_layout.addLayout(form_layout)
main_layout.addLayout(button_layout)

# Set the layout for the main window
window.setLayout(main_layout)

# Show the main window
window.show()

# Run the application's event loop
sys.exit(app.exec())

    In this extended example, we add a “Clear” button that clears the input fields when clicked. By connecting the clicked signal of the clear button to the on_clear slot function, we handle the event and clear the input fields.

    By integrating QLabel with other widgets and layout managers, you can create rich, interactive, and user-friendly interfaces. Experiment with different layouts and widgets to design the perfect interface for your application.

    Conclusion

    In this article, we explored the versatile and powerful QLabel widget in PyQt6. We started with an introduction to QLabel and its importance in GUI applications. We then walked through setting up your development environment, creating a basic QLabel, and customizing text in QLabel.

    We demonstrated how to display images, combine text and images, and apply styles using Qt Style Sheets. We also covered making QLabel interactive by handling events and delved into advanced features such as displaying rich text and scaling images. Additionally, we integrated QLabel with other widgets to create complex layouts.

    The examples and concepts covered in this article provide a solid foundation for working with QLabel in PyQt6. However, the possibilities are endless. I encourage you to experiment further and explore more advanced features and customizations. Try combining QLabel with other PyQt6 widgets and see how you can create rich, interactive user interfaces. Don’t hesitate to experiment with different styles, signals, and slots to make your applications unique and engaging.

    Additional Resources for Learning PyQt6 and QLabel

    To continue your journey with PyQt6 and QLabel, here are some additional resources that will help you expand your knowledge and skills:

    1. PyQt6 Documentation: The official documentation is a comprehensive resource for understanding the capabilities and usage of PyQt6. PyQt6 Documentation
    2. Online Tutorials and Courses: Websites like Real Python, Udemy, and Coursera offer detailed tutorials and courses on PyQt6, catering to different levels of expertise.
    3. Books: Books such as “Rapid GUI Programming with Python and Qt” by Mark Summerfield provide in-depth insights and practical examples.
    4. Community and Forums: Join online communities and forums like Stack Overflow, Reddit, and the PyQt mailing list to connect with other PyQt developers, ask questions, and share knowledge.
    5. Sample Projects and Open Source: Explore sample projects and open-source PyQt6 applications on GitHub to see how others have implemented various features and functionalities.

    By leveraging these resources and continuously practicing, you’ll become proficient in PyQt6 and be well on your way to developing impressive and functional desktop applications.

    Leave a Reply