Qt5

Qt5 is a toolkit that makes it easy to create standard Graphical User Interfaces with Python. Qt5 was created by the Qt company but is licensed as open source.

Setting Up the Application

The code below will setup a simple application with a single window. Copy and paste this code into a Python script and make sure it works. Then, try changing the size and title for the window.

# import sys so we can access the command-line arguments
import sys


# import all the Qt5 classes we are going to be using
from PyQt5 import *
from PyQt5.QtWidgets import *
from PyQt5.QtCore import Qt
from PyQt5.QtGui import *


# the window class definition

class SaimpleWindow(QWidget): # inherits from QWidget
	def __init__(self):
		super().__init__() # call the superclass (QWidget) to initialize

		# setup the window
		self.setGeometry(300, 300, 800, 800) # move and size the window (Left, Top, Width, Height)
		self.setWindowTitle('Sample Application') # set the window title
	
		# show the window
		self.show() # display the window to the user


# the main code

TheApplication = QApplication(sys.argv) # Create the application object
TheWindow = SaimpleWindow() # create the window
sys.exit(TheApplication.exec_()) # run the application until it is closed by the user

Adding Controls ("Widgets")

Push Buttons

There are a large number of user interface controls called "Widgets" that we can add to the window. Add the code below just before your call to "show()" in your SimpleWindow class and see what happens:

 # add a push button
 UpdateButton = QPushButton('Update', self) # create the button and give it a text label
 UpdateButton.move(5,0) # set the position of the button.
 

Try changing the text and the position of the button.

Connecting Widgets to Functions

Tyipcally, we'll be adding Widgets and then connecting them to a function that is called when the user interacts with the widget. Add the function below and then "connect" it to your button as shown:

 # add a push button
 UpdateButton = QPushButton('Update', self) # create the button and give it a text label
 UpdateButton.move(5,0) # set the position of the button.
 UpdateButton.clicked.connect(self.OnButtonPushed) # add this line to connect the button to a function
 def OnButtonPushed(self):
 TheMessageBox=QMessageBox() # create the message box
 TheMessageBox.setText("The button has been pushed"); # set the contents of the box
 TheMessageBox.exec(); # display the box to the user
 

Make sure the code works and then change the message in the box.

Now we can add additional widgets to make our dialog more interesting and to get information from the user.

CheckBoxes

Add the code below just after your push button code and then reposition the widgets.

 # add a check box
 self.TheCheckBox = QCheckBox('CheckBox', self)
 self.TheCheckBox.toggle() # turn the checkbox on
 self.TheCheckBox.move(5, 100) # set the checkbox's position
 

Labels

Add the code below after the code that creates your push button. Make sure it works and then change the position of the label and the button so they do not overlap.

 # add a label
	TheLabel = QLabel("Name:", self)
	TheLabel.move(5,130)

Text Edit Boxes

Text Edit boxes or "LineEdit" boxes in Qt allow the user to enter text such as labels, titles, descriptions, logins, and passwords. Add a LineEdit box as below and then move it to the right of your label.

 # add a line edit box
 TheLineEdit = QLineEdit(self)
 TheLineEdit.move(60, 40)
 

Getting Information from the User

A typical dialog will present a number of Widgets to the user and then have a push button, often labeled "OK", to start some action based on the settings in the Widgets. Let's take the text and have it display in our message box when the user clicked on our push button. First, we have to save the LineEdit object into the window so we can access it in the OnCheckBox function. This is done by saving the object into the "self" object which is the same as the object for the window. Change the TextEdit code to put the LineEdit object into self as below.

# add a line edit box
 self.TheLineEdit = QLineEdit(self) # save the line edit object into the windows object (i.e. it's "self")
 self.TheLineEdit.move(60, 40) # use the saved object
 

Now we can access the LineEdit object from within the OnButtonPushed() function as below.

 TheText=self.TheLineEdit.text()
 TheMessageBox.setText("The text you entered is: "+TheText); # set the contents of the box
 

Combination Boxes

A combination box or "ComboBox" includes a text edit field and a popup menu.

 TheItems=["one","two","three"] # an array with the items for the combo box 
 self.TheComboBox = QComboBox(self) # create the combo box 
 for TheItem in TheItems: self.TheComboBox.addItem(TheItem) # add the items from the array 
 self.TheComboBox.move(80,160) # position the ComboBox

Sliders

A slider allows the user to select values along a continum from a minimum to a maximum value.

 #add a slider
 TheSlider = QSlider(Qt.Horizontal, self)
 TheSlider.setMinimum(-180)
 TheSlider.setMaximum(180)
 TheSlider.setValue(0)
 TheSlider.setGeometry(80,190, 100, 30)
 
 

Creating a Small Application

From here, you just need to:

You can also put the results back into a label in the dialog if you like.

Additional Widgets

There are a large number of different widgets available in Qt. Check out the resources below for additional information.

Resources

Qt Tutorial - Excellent tutorial on building GUIs with Qt

Qt Documentation -