Masthead
QtDesigner

 

The QtDesigner is included with PySide2 and is installed in the Python "Scripts" folder as pyside2-designer.exe. To get started, just double click on pyside2-designer.exe. 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 pyside2-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 pyside2-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

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

# 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_()) 

Resources

Setting up and Using QtDesigner

 

© Copyright 2018 HSU - All rights reserved.