Python Graphical User Interface
If you are looking to build stunning, cross-platform GUI applications in Python, PyQt5 paired with the Qt Designer Tool is your go to solution. This toolkit offers a more modern and professional approach compared to the popular Tkinter library and in this article, we will dive deep into how PyQt5 stands out. First, we will guide you through the simple installation of PyQt5 followed by your first GUI form creation using a class based approach. Then, we will explore the Qt Designer Tool with its pre-defined templates which makes UI design a breeze. You will also get a detailed look at the essential components of Qt Designer and finish with a practical demo of a user credentials app. Whether you are just starting out or looking to enhance your app development skills this guide will help you get hands-on quickly and efficiently.
Let’s get started !
Table of Content
- Introduction to PyQt5 and Qt designer tool
- Comparison of PyQt5 with tkinter library
- PyQt5 framework installation
- First GUI form creation using PyQt5 by using class
- Installation of Qt designer tool with pre-defined templates
- Components of Qt designer
- User credentials app
Introduction To PyQt5 and Qt Designer Tool
In our previously launched sections building modern GUIs with tkinter and Python, we learned
how to create GUI forms using the Tk interface library. Now, we will be looking at another
approach to create the same GUI forms using one of the most popular cross-platform
libraries, known as PyQt5 library which was developed by Riverbank Computing. A robust
and cross platform graphical toolkit called Qt has a Python binding called PyQt5. Python is
a well known and simple-to-learn programming language, and with PyQt5 developers, we
can simply construct GUI applications using Python. With PyQt5, a visual layout tool called
Qt Designer is included. Without having to write any code explicitly, it enables developers
to construct GUI layouts quickly and easily by dragging and dropping widgets onto a
canvas. Additionally, Qt Designer offers a selection of editable widgets that may be used to
design distinctive user interfaces with eye catching visuals.
Comparison of PyQt5 With Tkinter Library
There are numerous Qt classes in a set of Python modules which are compatible with
many operating systems such as iOS, Windows, Linux, Unix, Android and so on, which is a
part of the top-level Python package, that is PyQt5 library. Qt5 in PyQt5 stands for Qt
version 5. This library provides us the advantage of Python binding with the Qt C++
toolkit. An important point to note is that under the GNU General Public License (GNU or GPL) v3 license, the PyQt5 license is being released. One may wonder that if we
have already learned about tkinter then why we should learn about PyQt5 as well. To
better understand this, let us check the advantages of PyQt5 over other libraries
such as tkinter.
- Flexibility in coding: In order to establish simple communication between objects there is a concept of signals and slots which gives us flexibility for GUI programming
using PyQt5, when dealing with events. - More than GUI toolkit: Using PyQt5 we can build entire applications using its
graphics, printer support, networking, database access and so on. It is like an
application framework. - Numerous UI components: PyQt5 offers numerous widgets such as QLabel, QButton,
QCombobox and so on such that each widget has some basic image well suited in all the
platforms. Numerous advanced widgets are also available on the topic in this library. - Numerous study resources: If there is no documentation then you might wonder
what the point of learning is. PyQt5 comes with a rich array of documentation since it
is one of the most commonly used Python packages for GUI creation. - Easy to understand: We can easily use previous knowledge of either Python, Qt or
C++, thus making PyQt5 easy to understand. - Preferred choice of GUI developers: Due to simplicity and ease of use, many GUI
developers opt for functionalities that come with PyQt5 to develop their own
applications. - GUI widget appearance: The appearance of PyQt5 is nice and pleasing to the eyes.
Now, we may wonder which library to choose to create GUI forms using PyQt5 or tkinter.
This generally depends on user application and the willingness to learn and explore. Table
1.1 further shows the differences between the libraries.
You can decide which library to choose to create GUI forms, depending on your application.
We will later discuss how to create a UI form using Qt Designer in detail as well as the
widgets associated with it and the Python code with logic written by importing the auto-code generated by creating the UI form in detail.
PyQt5 Framework Installation
- The Python version we will be using for discussing PyQt5 will be 3.7.3. You can try working
with new version as on today that is 3.11.5 dated Aug 24, 2023 from the location where
we have installed our Python first type the command python --version to check the version
installed and then type the command below to install pyqt5.
pip install pyqt5
Output:
2. Once installed, we can verify the installation of PyQt5 under the Python site packages folder that you see in the screenshot below.
Output:
3. We can check some of the modules present in PyQt5. If we do not get any error then we
can again cross verify that PyQt5 is successfully installed.
Output:
First GUI Form Creation Using Class
Now, we shall see a basic UI form creation using PyQt5 without using class. This is quite
important. As you might have realized most of the UI forms which we will be creating will
be using the concept of class and object. It is highly recommended that you go through the
concept of class before moving further in this section. It is well explained in our previous
sections, programming techniques using Python and Python for Everyone. Here, we will only
focus on our basic UI form creation. So, without any further delay, let us start. Refer to the
following code which can be checked in some IDE’s like VSCode, Spyder, Anaconda and so
on.
# importing necessary packages
import sys #L1
from PyQt5.QtWidgets import QWidget, QApplication #L2
myapp = QApplication(sys.argv) # L3
mywindow = QWidget() # L4
mywindow.show() # L5
sys.exit(myapp.exec_()) # L6
Output:
You will be surprised that by writing few lines of code, we can create our GUI form and that
too, as fully functional. Now let us see the explanation of this code line by line.
- In L1, we are first importing the sys module for accessing the command line arguments.
- In L2, we are importing from class, which creates desktop style UIs of PyQt5 package, that
is, Qt Widgets. QWidget is used for creating an empty GUI and QApplication is nothing but an
application handler. We can see that from the above statement, we are importing the
modules for creating the GUI form. - In L3, we are creating an instance, that is, object of QApplication class using the variable
name myapp and passing command line parameters list sys.argv to the application. When we
are sure that we will be passing command line parameters to control Qt form through shell
launching or during the course of interface automating, we can pass this as an argument to
QApplication class or else we can pass as an empty list as.
myapp = QApplication([])
- In L4, we are creating an object of QWidget class using the variable name mywindow. This QWidget
class is the parent class of all the User Interface objects in Qt. The top level window is
created by not passing any parameter to the QWidget class. - In L5, in order to make the widgets visible after creating the object of QWidget class, we must
call show() method with the object. Now, you may wonder what will happen if we do not call
this show method. Since after running the application, there is no way to close or quit it,
show() will be called to simply display widgets. - In L6, for implementing parallel execution, PyQt5 uses an event loop mechanism as it is
largely written in C++, So, to start up the event loop mechanism, we are calling
myapp.exec_() method which will be held by the application object. Some will even think that
at some places, we have seen myapp.exec. This exec was a reserved word in Python 2. So, to
avoid the naming conflict with this reserved word we are using exec_() in PyQt5. Therefore when there will be a requirement by the user to close the GUI, this myapp.exec_() will allow
the control to pass over to Qt to terminate the application. Just try using Ctrl + C to
terminate the application as done in our Python programs. You will find out that the
application will not be terminated. Now, if we want our code to return gracefully and not to
raise SystemExit exception, this event loop mechanism functionality is to be wrapped in a
function and should return from the place where we intend to use sys.exit. Therefore, any
exceptions that may be thrown or might occur, must exit cleanly using the following
statement.
sys.exit(myapp.exec_())
You will be wondering that in the above code, many classes start with a capital letter Q so
that it can be distinguished from other namespaces.
We can resize the window, drag it around to any conformable place, maximize it or close it.
Just make sure that you do not use the following, as it is best to avoid wild imports.
fromPyQt5.Qtwidgets import *
One important point to observe is that the GUI form comes up with the default title Python
and with default size.
Now, let us put some of our own title text in Python GUI form.
import sys
from PyQt5.QtWidgets import QWidget, QApplication
myapp = QApplication(sys.argv)
mywindow = QWidget()
mywindow.setWindowTitle('Basic GUI Form') # BG1
mywindow.show()
sys.exit(myapp.exec_())
Output:
In BG1, we are calling setWindowTitle() method from QWidget object and passing parameter as
Basic GUI Form. Therefore, we can see that our GUI form has a title that we wanted to
display at the top left. The rest of the code is the same as previous program.
Now, we can also specify the size of our GUI form that is, by specifying width and height
by calling the resize method as shown.
import sys
from PyQt5.QtWidgets import QWidget, QApplication
myapp = QApplication(sys.argv)
mywindow = QWidget()
mywindow.setWindowTitle('Basic GUI Form')
mywindow.resize(400,350) # RS1
mywindow.show()
sys.exit(myapp.exec_())
Output:
In RS1, we are calling the resize() method using the QWidget object and passing parameters as
400 and 300. So, here we are setting width as 400 and height as 300, which sets our GUI
form.
Therefore, we have learned the basic structure of creating a GUI form using PyQt5 without
the usage of class.
Now, we will learn similar examples, with usage of classes and objects concept.
Installation of Qt Designer With Pre-defined Templates
Till now, we have seen that for any package we want to install, we will be using the pip
command. But Qt Designer cannot be installed in your system using pip command like this
pip install pyQt Designer. So, you can either download it from source forge or install it using
pip install pyqt5-tools.
After this, run the designer from the following path.
C:\Users\%USERNAME%\AppData\Local\Programs\Python\Python37\Lib\site-packages\pyqt5-
tools\designer\designer.exe.
Launch the Qt Designer application and on executing, the following GUI window, as shown
in Figure 1.2, will be displayed to the user. Here, we can create our own GUI forms as per
our need.
Let us see some insights of Qt Designer. From Figure 1.2, we can see that there is an open
dialog box with title as New Form, prompting the user to select any of the templates, forms or
widgets on launching the designer. The widgets selection is shown in Figure 1.3.
- Dialog with Buttons Bottom: Using this template, a GUI form will be created with
2 buttons, that is, OK and Cancel at the bottom-right position, as shown in Figure 1.4.
The widget present is QDialogButtonBox.
- Dialog with Buttons Right: Using this template, a GUI form will be created with
presence of two buttons, that is, OK and Cancel, at top-right position, as shown in the
following Figure 1.5. The widget present is QDialogButtonBox.
- Dialog without Buttons: Using this template, an empty GUI form will be created
with superclass as QDialog, where the user can place widgets and create applications
as per their own requirement. - Main Window: Using this template, the main application GUI form will be created
with superclass as QMainWindow, along with the presence of menu bar and toolbar for the
user. The user may use it or may delete it as per the need. - Widget: Using this template an empty GUI form will be created with superclass as
QWidget.
These QDialog, QMainWindow and QWidget classes have their own importance.
- Suppose there is a requirement to create a GUI form by choosing dialog template. In that
case, all the widgets used will be inherited from the superclass QDialog. - Suppose there is a requirement to create a GUI form by choosing the main window template.
Then, all the widgets used will be inherited from the superclass QMainWindow. - Suppose there is a requirement to create a GUI form by choosing widget template. Here,
all the widgets used will be inherited from the superclass QWidget. - Moreover, the screen size is selected as Default size, as shown in Figure 1.6. We can select
the screen size from the list of items mentioned in the combo box.
Components of Qt Designer
We will see all the components inside Qt Designer in a nutshell now. There are some
numbers present across each arrow mark in Figure 1.7. We will be discussing them one by
one.
Here are the different numerically marked components:
- Menubar: The first thing which we noticed at the top will be nothing but the menu bar
of Qt Designer for GUI managing. It has File, Edit, Form View, Settings, Window and the
Help options for interacting with the user. - Toolbar: What we can manage using Menu bar can also be replicated using Toolbar.
The icons are placed instead of text for user interaction. It provides shortcut icons for
most useful functions. There are options like Edit Widgets, Edit Signals/Slots, Edit Buddies
and Edit Tab order, in this toolbar of Qt Designer. We will be using all these features with
demonstration of some examples. - Widget Box: This is one of the most important areas of Qt Designer. It is located on
the left side of the Qt Designer window. There is a list of widgets and layouts which
provides flexibility to create wonderful GUI forms, and you can access it by using the
drag and drop to any location of our GUI. We will study about all these widgets and
layouts in detail. - Object Inspector (OI): OI is located on the right side of Qt Designer window, which
displays the list of objects used in the form along with their layout display in
hierarchical manner. - Property Editor: Under OI, there is a Property Editor dock widget. In this dock
widget, we can change the property of a widget, layout or of a window as per our
requirement. - Action Editor: Under Property Editor, there is Signals/Slot Editor , Action editor and
Resource browser.
- In Signals/Slot Editor, signals and slots between the objects can be created,
deleted or edited as per our requirement. It may be noted that while using the
widget, complete configuration will not be possible as it requires possible amount
of coding by the user to get the end result. - In Action editor, we can create new actions, and delete actions. Moreover, there
is a checkable option for Used column, we can write text under “Text column”,
provide a shortcut key under “Shortcut column”, make checkable under “Checkable
column” as well as a tooltip that has been provided under “Tooltip column”. This
action editor will allow us to work with Actions. - Whenever there will be a requirement to manage resources like images, icons,
translation files and any binary files in our application, then we will be using Resource Browser. We will be learning this with examples.
User Credentials App
Finally, let us see the first example of Qt Designer. We will be creating a user credentials
application where the username and password will be prompted from the user. If they both
match, then we will display some message. This example is quite important to understand
because first we will simply display them by just dragging and dropping without using
the concept of layout and spacers. Then we will learn the concept of layouts and
spacers.
- We have selected the new template as Widget for creating the user credentials app
GUI form. - First drag 2 Label widgets under display widgets dock and drop it on the GUI form. We
are changing a few properties of these Label widgets. First is the text property of
which we have changed the text to Enter your username and Enter your password
respectively. Next, we have changed the font property. Moreover, we have also
changed their object names as mylbl_username and mylbl_password using the objectName
property. - Then drag 2 Line Edit widgets from the widget box and drop it on the GUI form. Using
objectName property, their names have been changed to lineEdit_username and
lineEdit_password. - Finally drag a Push Button widget into the GUI form and change its text to Confirm using
its text property. Then, using objectName property, its name has been changed to
mybtn_confirm. - Now, we are saving this GUI form with name as “user_credential_app.ui”. This .ui file is
nothing but an XML file which depicts form information, that is, widgets, layouts and
so on. In simple ways, we can understand that Qt Designer is independent of any
programming language and does not generate code in any of the programming
languages but generates a XML based .ui file as it is easy to understand.
The data contents inside user_credential_app.ui file is as follows:
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>Form</class>
<widget class="QWidget" name="Form">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>398</width>
<height>229</height>
</rect>
</property>
<property name="windowTitle">
<string>User Credentials App</string>
</property>
<widget class="QLabel" name="mylbl_username">
<property name="geometry">
<rect>
<x>14</x>
<y>50</y>
<width>161</width>
<height>20</height>
</rect>
</property>
<property name="font">
<font>
<family>Calibri</family>
<pointsize>10</pointsize>
<weight>75</weight>
<bold>true</bold>
</font>
</property>
<property name="text">
<string>Enter your username:</string>
</property>
</widget>
<widget class="QLabel" name="mylbl_password">
<property name="geometry">
<rect>
<x>14</x>
<y>120</y>
<width>161</width>
<height>20</height>
</rect>
</property>
<property name="font">
<font>
<family>Calibri</family>
<pointsize>10</pointsize>
<weight>75</weight>
<bold>true</bold>
</font>
</property>
<property name="text">
<string>Enter your password:</string>
</property>
</widget>
<widget class="QPushButton" name="mybtn_confirm">
<property name="geometry">
<rect>
<x>140</x>
<y>180</y>
<width>93</width>
<height>28</height>
</rect>
</property>
<property name="text">
<string>Confirm</string>
</property>
</widget>
<widget class="QLineEdit" name="lineEdit_username">
<property name="geometry">
<rect>
<x>210</x>
<y>50</y>
<width>161</width>
<height>22</height>
</rect>
</property>
</widget>
<widget class="QLineEdit" name="lineEdit_password">
<property name="geometry">
<rect>
<x>210</x>
<y>120</y>
<width>161</width>
<height>22</height>
</rect>
</property>
</widget>
</widget>
<resources/>
<connections/>
</ui>
Some important observations from user_credential_app.ui file are:
- We can see that whatever property we have changed such as text, font and
objectName all have been reflected in their respective widgets. - Moreover, default geometry property with x, y, width and height is mentioned
with values for each widget. - Just observe the Qt Designer property for each widget. The property whose color is
black object with bold text property will be displayed in the .ui file.
Let us now move on to the next step in creating the User Credentials App.
Our next task is to convert this XML based .ui file to Python scripting with the help of
command utility pyuic5. It is a dev tool to make the conversion of Qt Designer .ui file
to Python .py file. A good thing is that it is tied together with PyQt5. Therefore, we go to the folder where we have saved this “user_credential_app.ui” file which is saved in
the folder “Enter your file path\User Credential app” as shown in the following
Figure 1.9 by opening the command prompt window.
- Therefore, after opening of command window and navigating to the folder, we are
writing the following command.
pyuic5 user_credential_app.ui -o user_credential_app.py
After execution of the above command, we can see from Figure 1.10 that
user_credential_app.py file has been created and the python code inside this file is as
follows.
# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'user_credential_app.
#
# Created by: PyQt5 UI code generator 5.15.4
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 i
# run again. Do not edit this file unless you know what you are doing.
from PyQt5 import QtCore, QtGui, QtWidgets
class Ui_Form(object):
def setupUi(self, Form):
Form.setObjectName("Form")
Form.resize(398, 229)
self.mylbl_username = QtWidgets.QLabel(Form)
self.mylbl_username.setGeometry(QtCore.QRect(14, 50, 161, 20))
font = QtGui.QFont()
font.setFamily("Calibri")
font.setPointSize(10)
font.setBold(True)
font.setWeight(75)
self.mylbl_username.setFont(font)
self.mylbl_username.setObjectName("mylbl_username")
self.mylbl_password = QtWidgets.QLabel(Form)
self.mylbl_password.setGeometry(QtCore.QRect(14, 120, 161, 20))
font = QtGui.QFont()
font.setFamily("Calibri")
font.setPointSize(10)
font.setBold(True)
font.setWeight(75)
self.mylbl_password.setFont(font)
self.mylbl_password.setObjectName("mylbl_password")
self.mybtn_confirm = QtWidgets.QPushButton(Form)
self.mybtn_confirm.setGeometry(QtCore.QRect(140, 180, 93, 28))
self.mybtn_confirm.setObjectName("mybtn_confirm")
self.lineEdit_username = QtWidgets.QLineEdit(Form)
self.lineEdit_username.setGeometry(QtCore.QRect(210, 50, 161, 22))
self.lineEdit_username.setObjectName("lineEdit_username")
self.lineEdit_password = QtWidgets.QLineEdit(Form)
self.lineEdit_password.setGeometry(QtCore.QRect(210, 120, 161, 22)
self.lineEdit_password.setObjectName("lineEdit_password")
self.retranslateUi(Form)
QtCore.QMetaObject.connectSlotsByName(Form)
def retranslateUi(self, Form):
_translate = QtCore.QCoreApplication.translate
Form.setWindowTitle(_translate("Form", "User Credentials App"))
self.mylbl_username.setText(_translate("Form", "Enter your usernam
self.mylbl_password.setText(_translate("Form", "Enter your passwor
self.mybtn_confirm.setText(_translate("Form", "Confirm"))
So, here we can convert a .ui file into .py file.
This ‘-o’ in pyuic5 command which we had run here, stands for - -output, that is, writing
the generated Python code to the user_credential_app.py file.
One of the most important points to note after converting .ui file to .py file, is that the
modification of the Python code generated must not be done manually. This
is since any modification done will be overwritten the next time we will be creating .py
file from .ui file, when running using pyuic5 command.
- It is now time to create a new Python file called run_user_credential_app.py. Here, we will
be importing user_credential_app.py file and write some code into it such that when
username and password is matched/unmatched some message will be displayed to
the user.
import sys
from PyQt5.QtWidgets import QWidget, QApplication, QMessageBox # RUCA1
from user_credential_app import * # RUCA2
class MyWidget(QWidget):
def __init__(self):
super(MyWidget, self).__init__()
self.myui = Ui_Form() # RUCA3
self.myui.setupUi(self) # RUCA4
self.myui.mybtn_confirm.clicked.connect(self.myuser_credentials_ch
self.show() # RUCA6
def myuser_credentials_check(self):
if(self.myui.lineEdit_username.text() == ""): # RUCA7
QMessageBox.information(self, "Enter Username", "Username cann
return
if(self.myui.lineEdit_username.text() != ""and self.myui.lineEdit_
QMessageBox.information(self, "Enter Password", "Password cann
return
if(self.myui.lineEdit_username.text() == self.myui.lineEdit_passwo
QMessageBox.information(self, "Credentials check", "Welcome",
else:
QMessageBox.information(self, "Credentials check", "Credential
if __name__ == '__main__':
myapp = QApplication(sys.argv) # RUCA10
mywindow = MyWidget() # RUCA11
sys.exit(myapp.exec_()) # RUCA12
- Let us now understand the explanation of the source code.
In RUCA1, after importing the sys module for accessing the command line arguments, we are
importing from class, which creates desktop style UIs of PyQt5 package, that is, QtWidgets.
QWidget is used for creating an empty GUI and an application handler, that is, QApplication. In
addition to it, we are also importing a widget for creating dialogs, which is, QMessageBox. We
will be learning about this later. For your information right now, we are displaying a pop up
window with some informative text to the user. - We have created a new Python file run_user_credential_app.py to utilize Ui_Form class, which
was created using pyuic5 command from the Qt Designer .ui file . Here, MyWidget class will inherit
from Ui_Form class. So in RUCA2 from user_credential_app Python file, we are importing all the
members of a module. - In RUCA3, we are creating an instance of the Ui_Form class.
- For representing organization of widgets in a UI, a widget tree is built on the parent widget
Form by the method setupUi of the class Ui_Form. This generated class contains a method
called setupUi that configures the widgets and layout in accordance with the data in the .ui
file. When the Python code is run, the instance of the top-level widget class receives a call
to the setupUi method, which initialises all the widgets and configures the layout in
accordance with the data in the .ui file. The graphical user interface of the application is
essentially created using this method. There is also a retranslateUi method for translating
the interface, that is, for multi language support logic handling, regarding how the text is to
be displayed in the GUI. In RUCA4, we are passing a single positional argument self. - In RUCA5, we are using the concept of signals and slots. Here, when the whenmybtn_confirmbutton
is clicked (click event | signal), myuser_credentials_check method (slot) will be invoked. We will
study about signals and slots in detail later in this section. Just understand the flow of
concepts right now. - In RUCA6, we are displaying widgets by calling the show() method with the object.
- Now, we shall see what exactly we are doing inside myuser_credentials_check method which is
event handling for the mybtn_confirmbutton. - In RUCA7, we are first checking whether the text inside the line Edit_username is empty or not. If it is
empty, then a message is being displayed Username cannot be empty as informative text, in new
window, when you click on the confirm button.
The control will be then returned after clicking the Ok button. This message on the new
window is possible due to the QMessageBox widget.
In RUCA8, we are then checking whether text inside the line Edit_password is empty or not. This
indicates that the line Edit_username is not empty. If the line Edit_password is empty, then the message
password cannot be empty. is displayed as informative text in a new window, on clicking the
confirm button.
We can see that the text hello is written in line Edit_username widget. The control will be then
returned after clicking the Ok button.
In RUCA9, we are checking whether text of line Edit_username and line Edit_password matches or
not. If it matches, then the text with the Welcome message will pop up in the new window.
If the text is not matched, then Credentials does not match message will pop up in a new
window.
- In RUCA10, we are creating an instance, that is, object of QApplication class using the variable
name myapp and passing command line parameters list sys.argv to the application. - In RUCA11, we are creating an object of MyWidget class using the variable name mywindow.
- In RUCA12, for starting up the event loop mechanism, we are calling myapp.exec_() method,
which will hold by the application object. If we want our code to return gracefully and not to
raise SystemExit exception, this event loop mechanism functionality is to be wrapped in a
function and should return from the place where we intend to use sys.exit. So, any
exceptions thrown or might occur must exit cleanly using the statement.
sys.exit(myapp.exec_())
We can see that we have created an application user credentials app without the usage of
any layout management, that is, without any arranging of widgets in our UI form. Now, in
the next section, we will study how to create the same application by using layout
management.
Conclusion
In this section, we will learned about the difference between PyQt5 and tkinter library. We
learned about the installation of PyQt5 framework along with the creation of a basic GUI
form using PyQt5, first using the class. We saw various
components inside Qt Designer along with different pre-defined templates. We created a
user credential app by initially focusing on view in Qt Designer (.ui file) which was then
converted into a Python code (.py) using pyuic5 command. Finally, a new python file was
written by first importing the python code for user interface design where some useful logic
was built, so that a basic Login application can be designed at run-time for the user.
In the next section, we will learn about layout management which is the process of
organizing the widgets on a GUI. We will learn how child widgets will be arranged within
any parent or container widget. We will look into some commonly used layout managers,
which will include QVBoxLayout, QHBoxLayout, QGridLayout and QFormLayout.
