PyQt5 instruction manuals — Setup PyQt5(Ubuntu 20.04.3 LTS)
Zero to One: Instruction manuals — Day 1
Co-Author: Y. S. Huang, a master’s student studying AIVC, likes open-source.
If you are interested, go to check my Github!
What is PyQt ?
PyQt is a common and intuitive tool to design a GUI(Graphical User Interface). After using PyQt, you can involve the code with UI. And show the outcomes on windows.
Setup Pyqt5 and Qt5 Designer
First of all, we naturally need to install PyQt5 and Qt5 Designer by the commend downward. Qt5 Designer will help us design UI rather than purely typing code.
$ sudo pip install PyQt5 #Install PyQt5
$ sudo apt-get install qttools5-dev-tools #Install Qt5 designerIf you have a need for managing packege versions, using pipenv to install PyQt5 is a better way. Try this commend to install it by pipenv.
$ sudo pipenv install pyqt5To determine whether PyQt5 was installed successfully or not, you can create a .py file like this and run it. If you install PyQt5well, it should show a small window that “Hello World!” is created.
Get started!
Type designer or click the icon on the application list to open Qt5 designer which we had installed.
This is the initial interface of Qt5 designer. Choose the form you like! Here I chose “Main Window” for example. Afterward, there is a widgets box you can see on the left side. It contains tons of widgets which can compose various functions.
To select different widgets, just pull them to the place you like.
“Text Edit” widget can show text on the window.
Double clicks the widget to modify the font, size, color, and so on.
Not only the text format can be modified.
“Object Inspector” to see all the widgets on the window.
“Property Editor” to change the widgets including object name.
After designing, save the .ui file. Next step, we should turn the .ui file to .py file by this commend.
#The filename depends on what you typed.
$ pyuic5 -x UI.ui -o UI.pyLet’s look into UI.py.
In the function setupUi(), you can notice that an object called textEdit is the “Text Edit” widget that we created.
A new file appeared, run it to see the outcome.
So far, we had done window designing! Here are some tips for using PyQt5.
My suggestions for using PyQt5
Disassemble the code into three parts — Model, View, Controller (MVC)
Separating the code may help you manage different parts respectively. Here is an example. I create a window containing a “Push Button” called Button and two “Text Edit”, one is called qes and the other one is called ans . The final target of this window is to show the factorial of 10 after clicking Button.
#The filename depends on what you typed.
$ pyuic5 UI.ui -o UI.pyAdd two files named model.py and controller.py like the code below.
We have to calculate the factorial of 10 in this example, so I wrote an easy algorithm in model.py. Besides, there is also a program for testing. In this way, we can easily import factorial_sum to get the answer.
The focal point is at lines 13~18.
In line 14, you can see the object name Button I set it before. The meaning of this part is to give the response to Button.
While clicking Button, it will link to the function buttomClicked() and then run buttomClicked() continuously.
In line 17, I use the function factorial_sum() which imported from model.py .
In line 18, I set “Text Edit” widget ans to the number we got from factorial_sum() .
controller.py usually plays an important role in designing. You can easily build the function and use setup_control() to connect it.
UI.py is actually the same as the file generated by $ pyuic5 UI.ui -o UI.py , so we don’t edit it normally.
We can see this result after running the code upward.
The process of the code is: In the beginning, ans will show “Answer”, after clicking Button, it will turn into the calculated number.
Set easily readable object names.
Like controller.py in the example, all the modifications should specify the object name. Hence, readable object names are necessary if you don’t want to be confused. As the widgets you use are getting more, it will help you a lot.
Epilogue
After reading this article, I hope you had learned some fundamental concepts about PyQt5. In the next article, I will introduce more frequently-used widgets. Soon will come up!
