Python UI: The Qt Designer Application and the PyQt6 UI Library

In this article, we will first discuss how to install the desktop UI designer application known as Qt Designer from Qt Software. We will install Qt Designer as a system-wide independent application on both Windows 10 and Ubuntu 24.04. Next, we will briefly discuss using Qt Designer to make a simple dialog with two buttons.

In the third step, we install the Python PyQt software version 6, the PyQt6 library. Still in this third step, we are using a utility that comes with PyQt6 to convert the dialog we made in the second step into Python code. In the fourth step, we write a simple Python script which subclasses the generated dialog in the previous step, adds some code to the subclass, and displays the dialog. Finally, we discuss some background information.


Python UI: The Qt Designer Application and the PyQt6 UI Library

❶ Install Qt Designer as a System-Wide Independent Application

Please note that independent means not depending on the pyqt6-tools library as described in a later section.

⓵ On Ubuntu 24.04

The instructions in this section are based on the How to install PyQt 6 Designer in Ubuntu 24.10 post. Run the following commands to install:

$ sudo apt install qt6-base-dev
$ sudo apt install qt6-tools-dev

The location of the executable is /usr/lib/qt6/bin/designer. We can verify with the following command:

behai@HP-Pavilion-15:~$ ls -l /usr/lib/qt6/bin/designer

For my installation, the output is:

-rwxr-xr-x 1 root root 564576 Apr 16  2024 /usr/lib/qt6/bin/designer

To create an entry for Qt Designer in the Application area, we need to create the /home/behai/.local/share/application/desginer.desktop file. Replace behai with your own user name.

Content of /home/behai/.local/share/application/desginer.desktop:

[Desktop Entry]
Version=1.0
Name=Qt Designer 6
Comment=Qt Designer 6
Exec=/usr/lib/qt6/bin/designer
Icon=/home/behai/.local/share/applications/qt.ico
Terminal=false
Type=Application
Categories=Utility;Application;

The icon located at /home/behai/.local/share/applications/qt.ico is sourced from qt.ico. Finally, set the required permissions for designer.desktop:

$ chmod 755 designer.desktop

💥 I have found that I have to reboot to get the icon to display. Please see the screenshot below:

⓶ On Windows 10

It is fairly simple. Download the installation file Qt Designer Setup.exe from Qt Designer Download, it is only 40MB. After a successful installation, Qt Designer should appear in the Start Menu as shown in the screenshot below:

❷ Qt Designer Usage

⓵ On Windows 10

On starting, Qt Designer greets us with the New Form - Qt Designer window, where we can choose what we want to create. Select the first entry, Dialog with Buttons Bottom. Then, on the right-hand side, under the last entry Display Widgets, drag and drop a Label onto the dialog. Use the QWidget Property Editor on the right-hand side to change the label to something, as shown in the screenshot below:

I saved this dialog to F:\pydev\designer_ui\learn_dlg.ui. It is in XML format.

⓶ On Ubuntu 24.04

I don’t want to start from the beginning, so I just copied F:\pydev\designer_ui\learn_dlg.ui from Windows 10 to the corresponding directory on Ubuntu 24.04: ~/pydev/designer_ui/learn_dlg.ui. Double-click on the Qt Designer icon in the Application area, as previously discussed, then open ~/pydev/designer_ui/learn_dlg.ui:

It looks better than the Windows 10 one; the buttons have icons like the classic Borland Delphi form designer. To get finer positional placements and sizes, under the QWidget Property Editor on the right-hand side, look for geometry. We can use the keyboard to punch in the coordinates and sizes for each widget, allowing for finer adjustments by directly entering the numbers rather than using the mouse to drag them around.

❸ The PyQt6 Library Installation and Usage

The active virtual environment is F:\pydev\venv on Windows 10 and /home/behai/pydev/venv on Ubuntu 24.04. Install PyQt6 using the following command:

▶️Windows 10: .\venv\Scripts\pip.exe install PyQt6
▶️Ubuntu 24.04: ./venv/bin/pip install PyQt6

The following discussion is based on this discussion. 👉 Please note that the sub-directory pydev/py_ui/ must be created first.

⓵ On Ubuntu 24.04

To convert /behai/home/pydev/designer_ui/learn_dlg.ui to /behai/home/pydev/py_ui/learn_dlg.py, either of the below commands will work:

$ ./venv/bin/pyuic6 -o ./py_ui/learn_dlg.py -x ./designer_ui/learn_dlg.ui
$ ./venv/bin/python -m PyQt6.uic.pyuic -o ./py_ui/learn_dlg.py -x ./designer_ui/learn_dlg.ui

💥 As /home/behai/pydev/py_ui/learn_dlg.py is a generated module, the next time the conversion takes place, it gets overwritten. In our code, we must subclass it rather than adding code directly to it.

⓶ On Windows 10

The commands are similar:

.\venv\Scripts\pyuic6.exe -o .\py_ui\learn_dlg.py -x .\designer_ui\learn_dlg.ui
.\venv\Scripts\python.exe -m PyQt6.uic.pyuic -o .\py_ui\learn_dlg.py -x .\designer_ui\learn_dlg.ui

The generated module ./py_ui/learn_dlg.py is fairly straightforward. Most of the code is about preparing the UI widgets, and it assumes that the methods for the buttons’ click events exist.

❹ PyQt6 Example: Subclassing ./pydev/py_ui/learn_dlg.py's Class Ui_Dialog

The script below implements the click-events for each button. To shut down the script, users need to click on the dialog’s Close button.

import sys

from PyQt6.QtWidgets import QMainWindow

from py_ui.learn_dlg import *

class LearnPyQtWindow(QMainWindow, Ui_Dialog):
    def __init__(self):
        super().__init__()
        self.setupUi(self)
        self.setWindowFlags(QtCore.Qt.WindowType.CustomizeWindowHint | 
                            QtCore.Qt.WindowType.WindowCloseButtonHint )
        self.show()

    def accept(self):
    
    print("You clicked the OK button...")
        # Enable self.close() to close the dialog on clicking.
        # self.close()

    def reject(self):
        print("You clicked the Cancel button...")
        # Enable self.close() to close the dialog on clicking.
        # self.close()

if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    login = LearnPyQtWindow()
    sys.exit(app.exec())

Let’s briefly explain the script:

● Turning off the dialog’s Maximize and Minimize buttons:

        self.setWindowFlags(QtCore.Qt.WindowType.CustomizeWindowHint | 
                            QtCore.Qt.WindowType.WindowCloseButtonHint )

This line actually means only the dialog’s Close button is shown.

● The accept and reject methods: These are the buttons’ click-event methods that the generated module ./pydev/py_ui/learn_dlg.py assumes are implemented. See lines 33 and 34:

33
34
        self.buttonBox.accepted.connect(Dialog.accept) # type: ignore
        self.buttonBox.rejected.connect(Dialog.reject) # type: ignore

On Windows 10, the script shows:

We can see that only the Close button is visible and functional. The dialog is shown in the center of the screen; I did not set this position in the design—it is its default behavior.

On Ubuntu 24.04, the script shows:

The Maximize and Minimize buttons are visible but disabled. The Close button is functional. 💥 The dialog is not centered on the screen as it is on Windows 10.

❺ The pyqt6-tools Library, Released: Mar 28, 2023

On Windows 10, I first installed Qt Designer with the pyqt6-tools library, but only with Python version 3.11.9; versions 3.12.xx and 3.13.xx fail to install pyqt6-tools. In a virtual environment venv, the Qt Designer executable location is .\venv\Lib\site-packages\qt6_applications\Qt\bin\designer.exe.

On Ubuntu 24.04, Python 3.11.xx is no longer available. I have version 3.13.0 installed. Installing pyqt6-tools using Python 3.13.0 results in other errors as well. Please see the screenshot below:

Trying to solve these problems has led me to the realization that the Qt Designer application can be installed as an independent application, as discussed. This should make sense too, as we do not need this application on a per-virtual-environment basis.

❻ While trying to sort out the problems with installing Qt Designer, I came across The Qt Group website, where they offer a Qt Installer application for download. The installer itself is about 50 MB. When I ran it, the default installation requires 300 GB (three hundred gigabytes). I attempted to turn off most options, leaving only what I assumed would install the Qt Designer application, but it still required around 40 GB—so I abandoned it altogether.

❼ Other related sites that I find helpful:

PyQt5 Tutorial -- I started off learning PyQt with this site. I completed all the tutorials, and then I found out that PyQt6 is the latest version.
PythonGUIs -- I have found some useful information on PyQt6 from this site.

❽ Having successfully gathered the information to install the Qt Designer application on both operating systems is satisfying. The information is readily available on the internet, but strangely enough, not centralized. I still have not figured out the actual official home page for the Qt Designer application yet 😂… I assume it is the Qt Group website.

Thank you for reading. I hope you find the information in this post useful. Stay safe, as always.

✿✿✿

Feature image sources: