QtDesigner

QtDesigner or PyQtDesigner is an easy to use graphical user interface editor. If you are going to try and create an applicaation that includes a number of windows and/or dialogs, I would definitely use it.

Some blogs say that the PyQt5Designer is installed with PySide but I had to install it with:

pip install PyQt5Designer

It was installed in the Python "Scripts" folder as pysideX-designer.exe where "X" is the verson of PySide you are running. For some reason, it did not install in the system Python folder it installed in:

C:\Users\jg2345\AppData\Roaming\Python\Python311\Scripts

Just double click on "pysideX-designer.exe" and it should run.

Then go to "File -> New". Select "Main Window" and then "Create". This will create a main window layout for your program. Now add widgets to your window. When ready, save your window to a folder for your project. Notice that the resulting file will have a file extension of "ui" and is an XML file containing the layout for your window. You can use this same process to create dialog boxes.

The next step is to convert your "ui" file into a Python script. One way to do this is to run the pysideX-uic.exe program which is also installed in the Scripts folder when PySide2 is installed. You'll need to make sure you are running the right version pysideX-uic.exe and you'll need to speify the name of the input, "ui", file and the output, Python file. I recommend creating a batch file that has contents like the following and then storing the file in your project folder with your "ui" file. This way, when you update the GUI, you can just run the batch file to update your scripts. If you create additional windows or dialogs, you can just add them to the batch file.

"C:\Program Files\Python39\Scripts\pyside2-uic.exe" MainWindow.ui > MainWindow.py 

Setting Up the Application

The code below is similar to other PyQt5/PySide2 programs but notice that the MainWindow class inherits from UI_MainWindow. UI_MainWindow is the window we created in QtDesigner. We need to call setupUI() in our __init__ function so setup the window. Then, we just need to add connector (i.e. event handler) functions and connect them in our __init_ function.

################################################################
# Sample code to create a Python application based on PySide2.  The approach
# below allows us to create GUIs in QtDesigner and use them in Python programs
# Created By: Jim Graham 
# Based on: https://www.badprog.com/python-3-pyside2-setting-up-and-using-qt-designer
# Date: 4/8/2021
################################################################

import sys
#
# Import PySide2 GUI library from PySide2.QtWidgets  import QApplication, QMainWindow

from PySide6 import * # from PySide2 on the HSU vlab.
from PySide6.QtWidgets import *
from PySide6.QtCore import *
from PySide6.QtGui import *

# Import the GUI class we created in QtDesigner and converted with pyside2-uic.exe from MainWindow  import Ui_MainWindow

import MainWindow
from MainWindow import *

# This is a subclass of the class we created in QtDesigner.
# This approach allows us to modify and update the windows and dialogs we
# create with QtDesigner and then add connectors (event handlers) and other
# operations here.
class MainWindow(QMainWindow, Ui_MainWindow):

	# Event handlers
	def slotButton(self):
		print("hi")
		#self.label.setText("Hello from Badprog :D ")

	# Initialize the "self" object from this class
	def __init__(self):
		# Call the super class (parent class) to create the object
		QMainWindow.__init__(self)
		
		# Call the super class to setup the GUI
		self.setupUi(self)
		
		# Connect any widgets to their event handlers
		##self.pushButton.clicked.connect(self.slotButton)
		
		# setup the main window
		self.setWindowTitle("Hello World")
		self.setFixedWidth(500)
		self.setFixedHeight(500)

# 
if (__name__ == '__main__'):

	# Create the application and pass any command line arguments to it
	app = QApplication(sys.argv)

	# Create and show the main window
	mainWindow = MainWindow()
	mainWindow.show()

	# Turn control over to the application until it returns and then we exit
	sys.exit(app.exec_()) 

Once you have this setup, it is pretty easy to:

1. Go into the PyQtDesigner
2. Make any changes you want to the user interface
3. Save the ui as a *.ui file
4. Run the batch file
5. Go back into your Python IDE and write code!

Resources

Setting up and Using QtDesigner