QtDesigner and PyQt5: The right and wrong way to use them together
ฝัง
- เผยแพร่เมื่อ 2 ก.ค. 2024
- Author Alan D Moore describes some common pitfalls of using QtDesigner with PyQt5, and the proper way to combine the two to build GUI applications.
Follow Alan at www.alandmoore.com
Purchase a copy of Mastering GUI Programming with Python here: amzn.to/3Dr8cAy
Find some example code from the book covering the use of PyQt5 with QtDesigner at github: github.com/PacktPublishing/Ma...
Example code for this video can be found here: github.com/alandmoore/PyQt-Vi...
Thanks for watching! - วิทยาศาสตร์และเทคโนโลยี
2022 and still the best video here on youtube about this topic! Golden tips. There a lot of content about PyQt5, but they are not so usefull as this video, because it clears so much and explains how does it work.
I found your video after doing 80% of the wrong steps you went over here. Thank you for explaining this so clearly. I'll be getting your book for sure.
Extremely valuable advice, exactly what I was looking for! Thanks a lot!
Excellent video, thank you! 30 minutes to remember everything I've forgotten over the last 4 years. 👍👍👍
You saved my life on my senior design project. Couldn't figure out why none of my buttons would connect and now it all makes sense!
Very useful. My past GUI apps have been browser based but I have to do one now with Qt. Tried out Designer and was undecided about it until I watched you video. Your last comments were spot on. Thanks!
Thought this was obvious enough, seems like it wasn't, thanks for doing this labor for all of those who didn't think they would loose their changes
This is one of those mistakes I ran into far too often and just had to make a video, because explaining it again and again on reddit or other forums was too tedious. To be fair, a lot of people just aren't thinking they're going to go back and re-edit the layout in Designer, they just want to get something going. Unfortunately the demo code that pyuic5 tacks onto the bottom steers them in the wrong direction about how to actually use the class.
I have already made the mistake in making my application and already gone so deep in the development that I think it can't be undone. Will start from scatch again.
I feel very lucky that I stumbled across your channel.
thank you very much, this video is extremely helpful, I'm here because an user from stackoverflow recommended me to watch your video.
This was SO helpful! Thank you for creating this!
Excellent video. I add that the UI compiler can be configured in the IDE (in my case I use PyCharm) as an "external tool", so that, after modifying and saving the .ui file with QtDesigner, it is no longer necessary to manually compile the file .ui (with just three clicks inside PyCharm, and the updated code appears).
A lot of extremely useful advice is in this video. Thank you so much!!!!
Hi! Your channel saved me! I’ve been making this exact mistake in my project and suffering from all these errors and not understanding whats going on! found your video three days before deadline, I fixed everything thanks to you. I hope you’re safe and happy.
Thank you, doing well here. Glad this video helped.
This is truly excellent and answers a bunch of questions I had.
Lol. Just bought the book last week and read all of it now found this. PERFECT.
Thank you for the clarification on this!! I handed coded a PyQt5 GUI for a project at work and was just investigating using the Designer (but not wanting to really re-do my code). Having wrote the GUI by hand, I can see the value in not over complicating it with Designer...I'm served better by just understanding PyQt5 as a whole. Thank you again for the clear and concise video, and your professional advice!! 2023....still makes sense. lol
This was excellent..I was avoiding using the "designer" since it created "read only" code and I wasn't sure how to incorporate it. Now that I know it creates "an inheritable object"..that's all changed.
Amazing! All your explanation was clear. Thanks to share your knowledge.
I'm so glad that I've found this video. You're THE man!
Thanks!
Thank you very much! You explained exactly what I wanted to know.
That is a very good piece of advice for people who are beginning to build GUI's in Python using Qt. Thanks very much.
Glad it was helpful!
I just discovered a gem.
Thank you.
Thank you!
LOL I was doing exactly what you said (copying and pasting). What great advice. No surprise you wrote the book on it. Gotta get the book.
Thank you so much for all of these videos! you saved me so much time ❤
Thank you for teaching the sanity, and correct "python" way.
I have been watching many vids and they either change the generated code which I know is wrong since all those changes would have to be done again, or the import the ui, which makes the app way slower at start up. I was struggling getting my mind wrapped around using these classes and you made it clear :-). Your book is now on it's way to my home.
Thank you again for the clarity.
Glad I can help!
My bigger problem with loading the ui dynamically with PyQt5.uic is that your editor cannot give you any context-aware code completion, and you instead have to keep Qt Designer open and read it like a blueprint, also going to the Qt documentation every time you forget the name of a relevant method. Just a terrible workflow when you could instead have a static file for your editor to provide clues on.
Thanks for the wonderful video.... This really saved me a lot to trips to the documentation and google...
Great video. Thank you. I am going to check you book.
I was 10 seconds away from doing everything the wrong way. Thank you for demonstrating this!
this is the video i needed to see, thank you very much
This was extremly helpful for me thank you sir! God bless!
thats extactly what i was looking for. Thank
Thank you so much Alan D Moore
Excellent one, very well explained, Thank you.
You are welcome!
I have seen this video floating around for a couple of months, never watched because it was 37 minutes long, lazy I know but truth. I am so glad I finally watched it as it clarified so much to me. Thank you!
Ha! Yeah, I think that was one of my first coding videos, I'm still trying to get the length shorter, but I like to talk too much. Cheers!
@@alandmoorecodes3585 No, I completely disagree, many coding TH-camrs just write code you also explain it, which (in my opinion) is 5x more valuable :) I started with QT yesterday and cannot wait to write some basic applications :)
@@aiyushg1769 Thanks!
Excellent video! Great how the wrong steps are shown. I'm buying the book.
I came to PyQt to get away from something similar in Kivy which I just couldn't reconcile myself with. Thanks much for explaining it so I could understand the similarity.
Exactly what I needed to know!
It was interesting watching this video, because I’m reading your book (well, re-reading. Qt is complicated). On your ending comments about coding directly instead of using Designer: I do know from your book how you quickly create some sets of widgets (some of it’s not really ‘manual’, wink-wink.). But also, I’ve created a few more involved GUIs, and I can appreciate making some big changes in Designer, then quickly back up in running editing the slots and other methods without having to worry about the GUI code. So I’ll probably keep doing it both ways.
Thanks for your book. Cheers. :-)
I'm an artist and I always liked to learn programming languages... a few years ago I started learning Python by myself, searching tutorials here and there, when I knew about QT Designer I said to myself: "This is what I need, I'm an artist, I need visual design". Then, a few days later I understand is much more easy and fun (to me) code the full UI, it's make easy to me to add a "UI presets menu" to the app I was doing that let the user change the app apareance. Thanks for the video, is amazing
Lol. Maybe it's because I'm NOT an artist, and I've been doing all manner of coding in the past 10 years. But I'm over coding my UI elements, especially when there's a better alternative, like using a designer program and dragging and dropping the elements that I need.
Beautiful explanation. Thanks
Thank you. I bought your book based on this excellent video.
Thanks!
Excellent video! Excellent presentation!
Thanks
Nice tutorial. Thanks.
As a C# developer and only recently discovered PyQt5, I am familiar with working with multiple files, and the idea you do NOT mess with MainForm.Designer.cs directly. I have been following a YT course using the designer, and doing exactly what you should not do, which worked well, but was frustrating if you need to re-design anything, so your video was an excellent introduction to the correct way to use it.
I disagree with your views on using it in the first place, as I find beginners like to see instant results, especially when using CSS in the StyleSheet property. They can check their design and adjust it to perfection, which encourages them to tackle the code needed to interact with their shiny new GUI. Using PyQt designer is similar to using WPF in C#, where you can hand-code directly in XAML, or use the built-in WPF designer in Visual Studio.
Book ordered from Amazon uk!
Excellent, thank you very much !
Incredible video
Thank you so much ! Finally this make sense now .
Awesome! glad it helped. :-)
you are a legend. thank you so much
i like this man, thank you so much, giant help!
This has been very helpful. In 2022 Intellij Pycharm, I can start both Qt Designer and PyUIC by right-clicking in the Project pane. There still is the extra level of code but does not require running CMD. Thanks for your help.
You are a very good teacher 🔥 Respect from Pakistan !
Now that is a serious Python developer who codes in emacs. :) BTW I really love your book on PyQt. Really helped me get started.
You should be knighted for this. Sir Alan D Moore sounds just right!
Thanks!
this is very hepful thank you.🤩🤩
Thank you very helpful
It's kind a pain in the ass that i always edit and move my code every time i changed the design. You saved my time, thankyou
Thank you! This was very helpful. Now I'm having problems with my gui intermittently freezing when I try to update labels with setText.
Hi, thanks for the tutorial. I am a beginner in python and I did it exactly the wrong way you've shown. Now I am modifying my code and do it the right way by having separate files main program and ui. However, i am still confused about the signal and slot method. For example I have a push button that is disabled initially but will be enabled once there is a textedit in a line edit. It seems to me that it should be done in the ui file instead of the main file. But I couldnt find the right signal and slot to connection to do this so I end up writing this connection in the main file. Any idea which one should be inside the ui and which one in the main?
needed this so bad
Nice one
Perfect ! thanks a lot
You're welcome!
This is it👍👍👍
Spot on! - been looking for this exact method using python + qt, thanks for the vid. I use vb.net c#.net and this kind of behaves like this as standard. I do like the QT editor though...
Next step - opening another window within the main class ;-)
Glad it helped!
you can use pyside designer then form > view code in python to easily copy code so you dont have to open cmdr to convert it to .py everytime, its really useful
then you can't use pyqt the python code generated is for pyside. you have to do the method he showed to generate python code for pyqt.
Useful
Hello, great video! So I'm starting to work my way through the book. I'm using Visual Studio Code, did a pip install of PyQt5 ran the first couple of demos and all was good. Installed Designer and messed with it a bit then went back to my saved code in VSC and now get the error ImportError: DLL load failed while importing QtWidgets: The specified module could not be found. No matter what I do. Windows install, Python 3.8. Thanks. EDIT: Uninstalled PyQt5 and reinstalled and now it works. Seems Designer overwrote something PyQt5 needed.
I come from C#/C++. Surely there's some Model-View design pattern for this.
Edit: and this is a very good video telling how it is.
If one would argue that GUI's are made in RAD's these days, then they forgot about the endless number of programmers who still use XAML to make GUI's in Visual Studio for example.
perfect! thanks
You're welcome!
for those trying to override code in Ui_MainWindow, u need to inherit it as well to have access to its objects.
I used loadUi to load UI from Qt instead of compiling it into python code, but that way you don't get auto-completion for widget object variables when using Pycharm.
Hi, great video! I wonder what is the difference to using uic and load the ui file with that when running the app in terms of inheritance, using the widgets from within the View class that inherits the Ui_Form, using them from an outside Model class and finally what about the signals? Do you recommend using uic or is it better the way you show us?
I'm sorry for all these "heavy" questions. So far I couldn't find good answers for these, I only found bad examples.
I went through your videos and most helpful is this one: th-cam.com/video/5QpguaNFecQ/w-d-xo.html
Thanks Markus; keeping in mind that I'm not a huge fan of using QtDesigner, so I haven't worked out the best ways to make use of .ui files, I find that loading .ui files at runtime is a little awkward since it requires having a QApplication instantiated first. But maybe there's an elegant solution to that.
Normally I just hand code the GUIs.
It is really great advice but it has one drawback which is you need to recompile the QT designer code for every time you change on it to get the module and then included in main python file as described above on youtube vedio. My question is why we don't link the XML of the QT designer withen the python code and read that XML file automatically so once the QT designer changed, it will change as well in python code so no need for recompiling and get the python code of QT designer. My idea is actually taken from Java FXML. In Java FXML once we change in the scene builder automatically reflect on the XML which java will read and new change will be available for you to make custom functions to deal with your new change.t
Hello, I'm really glad I found your channel. It is the only one so far that actually has academic roots and I appreciate that. Do you have any code that uses pandas and PyQt5 together? I am trying to display some data from a database. Depending on the data my users choose, that data could look very different but with the same column names. I am trying to add check boxes inside the qtablewidget so users dont have to type the names of the rows they want to keep (additional processes are made with those names they choose later on).
Here is what I have for putting the data into the qtablewidget. Is there an easier way?
def update_table(self, df_name):
self.ui.dataframe.setRowCount(0)
self.ui.dataframe.setColumnCount(0)
self.ui.dataframe.setRowCount(len(df_name))
self.ui.dataframe.setColumnCount(len(df_name.columns))
self.ui.dataframe.setHorizontalHeaderLabels(
list(df_name.columns))
i = 0
while i < len(df_name):
for col in df_name.columns:
self.ui.dataframe.setItem(
i,
(df_name.columns.get_loc(col)),
qtw.QTableWidgetItem(
str(
df_name[col].iloc[i]
)
)
)
i += 1
And for the checkboxes inside the qtablewidget, is that possible/practical? The users basically just want to check something instead of type it in.
Thank you in advance.
It's possible to put something other than a text widget in a tablewidget cell, but it breaks a lot of the automatic model/view behavior and you'll need to do a lot of custom code around it.
I haven't done work with combining Pandas and Qt, but depending on how complex your application is going to be you might be better off building a model around your Pandas data. Then your GUI doesn't have to be so intimately tied to Pandas, the model can handle all that.
Thank you for the advice. I will research that a little more to see what I would need. I would be very interested in hearing/learning more about about the model-based views and how they are different from the widget based items in PyQt5. Thanks again!
thanks.
Hi! What if you have multiple windows that have to open? For exemple, if a pushbutton in pressed in the main window, then a second window shows up. I'd have both windows generated with qt designer. How do you write the code for main ?
Should I create different classes inside main.py ? But how do I show the second window and pass the variables ?
you would create a different subclass of QWidget for each window. Your callback in the first window would then create an instance of the second class and call it's .show() method.
There is an example of one window opening another in my book, you can see the code here:
github.com/PacktPublishing/Mastering-GUI-Programming-with-Python/blob/master/Chapter03/form_window.py
It does not use QtDesigner, but the principle applies either way. The only difference is that each QWidget class's __init__ method would create the applicable UI class rather than manually building the widgets.
23:01 so it should be used as a library. i have a question. can it be converted to an .EXE file easily later on?
Thank you it was really very well informed. How can we extend this code for multiple windows?
You'll just repeat the process for each window. Probably only the main application should be based on QMainWindow, the others should be QWidget-based. The thing to understand is that the code you get from designer is *not* your window/widget class, it's a ui builder that is meant to operate on a window/widget class which you provide.
Hi Alan,
It was very nice video. I am using your way. First design in QT designer, then use pyuic5 then create a second file to call the converted file and prevent to overwrite on pyuic5's file. But I have 1 problem which is making me crazy.
Firstly, in the second file we use super().__init() to initialize. But if the class inherit from 2 other classes, one is pyuic5's file and the other class, how we can use __init__??? For the second class, for example call it ClassB, we can use ClassB.__init__(*arg), but what we should use for pyuic5??? If i dont use super().__init__() i will face with error, while if I use super().__init__ I can initialize ClassB :((((
So how we can solve the problem of parallel inheritances when one of them is related to pyqt??
.
Br
Thank you
You're welcome :-)
Anyone looking at QtDesigner and getting nostalgic vibes for Visual Basic from back in 1998? I remember that dotted grid very well. :(
Hello, in this simple example all the method callbacks are defined in one module login_box_main.py which is fine. But for larger projects where the GUI may have many elements how can we define the method callbacks across different classes/modules. Thanks again for the nice explanation to begin with.
Check out this video, I think it might help: th-cam.com/video/SmUZEBXBKTk/w-d-xo.html
Great Video and very insightful. What are your thoughts on using QT Designer and converting it to PySimpleGUI? Is there a clean "RAD" way to do this?
Appreciate your feedback.....
Thanks
I can't really comment with any authority on PySimpleGUI since I haven't used it. I'm probably the wrong person to ask about RAD tools though; I know everyone's after a RAD solution because that's more modern, but honestly I've just found that I get along better with code than with point-and-click interfaces.
One more point, we could use "loadUiType" function under "PyQt5.uic" package to load ui files directly into Main Window, which avoid conversion for .ui files into .py files
# example code
from PyQt5.uic import loadUiType
Ui_MainWindow, QMainWindow = loadUiType('login_form.ui')
class MainWindow(QMainWindow, Ui_MainWindow):
def __init__(self, *args, **kwargs):
super(MainWindow, self).__init__(*args, **kwargs)
self.setupUi(self)
I heard it slows the App down at startup, if you load the ui file and dont use converted code
we could use this feature for rapid developement then. post developement we could move to .py files
@@codenio that's true. for me I dont care too much I just go to Form in qt Designer, view Code, click the copy Button got to the file and Ctrl-a ctrl-v
im bad in English, but you talk very funny and interesting. Ty for the video
I did everything you did @28 min, but for my new .py file I inherited from qtw.QMainWindow instead of qtw.QWidget because the GUI I created with QtDesigner was a QMainWindow. For some reason when I run my new .py file, it opens a blank GUI with the title "python". Do you have any idea what the issue could be?
It's hard to say without looking at the code.
my problem is that i couldn't connect the buttons to functions...
Hi , Could you please help me my Qt Designer on mac cannot support .jpg file? .ico file can be recognized.
Sorry I have no idea about that.
Hey Alan,
I've got 2 questions.
1. It's
Is it possible to create window or internet browser like transition in pyqt5?
At present, we are using Qdialog to display the new window each time we click a button.
2. What is the best way to display images on our window?
I and my friend are working on a project (DBMS with pyqt5) we have a lot character images to display.
You can do some things using QPropertyAnimation, but it's somewhat tedious and limited; it only works on Qt Properties, which many things you'd like to animate are not (colors, for instance). To make it work for those things, you have to implement them as properties in a subclass. QML might be a better approach if you want something really animated with fancy transitions.
The simplest way to display an image is to put it in a QPixmap and display it with a label. Nothing wrong with that approach, but if you want to do fancier things or layer a lot of images (for a 2D game, for instance), you might look into a QGraphicsScene, which is Qt's answer to the Canvas objects you find in HTML/Tkinter/etc.
@@alandmoorecodes3585 thank you
@@alandmoorecodes3585 Do you know any good tutorials for QML with python?
@@aiyushg1769 I haven't found one yet that really resonates with me or takes time to explain things yet, but if I find a good one I'll point it out.
@@alandmoorecodes3585 Thanks a lot :)
The example code presented in this video is not found at the link provided; only the full python code, not the code used to run the loginvox.ui file. Moreover, the code "submit_button" is not in the form, however, "pushButton" is - among other problems. The author has conflated a mix of files from the video above and the referenced "Example code for this video" which requires a lot of debugging to get this thing to work. I recommend seeking some other more reliable source of information on this topic to avoid a lot of trouble and confusion.
Is there any benefit in converting .ui file to .py ? I assume we will still need pyqt5 installed in our environment??
In theory, you save some initial start-up compilation time, but I doubt this is significant in most cases. In all honesty, I'm not a fan of using QtDesigner at all, so I may be speaking from a place of ignorance, but I find the process of rendering .ui files in a script to be somewhat awkward. I find it simpler to just import a Python file if I'm going to go with the QtDesigner route at all.
I'm sure I'm doing this wrong, but I did this but instead of QWidget I did it with QMainWindow. It essentially rendered multithreading useless. Now the GUI freezes whenever I do any long running processes, not an issue when I did it "the wrong way". I created a very large project "the wrong way" and was able to manage it with diffing code whenever I needed to go back and add some designer element (which I know is wrong and bad because it is difficult to manage). BUT I did not have issues with threads blocking the main window. Can you do another video like this but instead of QWidget, show how QMainWindow is supposed to be?
Hi. i have read your books, and i concern on raspberry Pi with pyqt5 python in chapter 15.
I dont understand how to use GUI Pyqt in raspberry GPIO. Would you give a basic example program such as :
1. How to turning On LED with GUI PyQT
2. How to read Digital data input (example GPIO 04) from raspberry to display in GUI PyQT
3. How to make serial communication Read and Write with GUI PyQT
or maybe more advanced
4. Using SPI, I2C communication with Raspberry in GUI PyQt
thank you so much.
Thanks for your ideas. At the moment I can't do much with the Pi since my daughter has appropriated it for her own use; got a Pi 4 on the Christmas wish list, maybe I can do a new video if it shows up in my stocking. :-)
In general, though, doing pretty much anything with a Pi and PyQt5 is going to run along the same lines as what was done in the book: create a QObject subclass to manage the GPIO interactions, use signals and slots to communicate back to the GUI, and use QThread to keep the GUI from locking up. The sensor example in the book could be adapted to any GPIO operations you want to run, really.
How can i purchase your book from Pakistan, Sir , Please guide .
Do you happen to know when Qt Designer will be available for PyQt6?
Sorry, don't know
@@alandmoorecodes3585 I ended up using PyQt5 instead. PyQt6 doesn't seem all that finished yet.
Hello, can you please help. I can't get the gui window to run. If I run the UiForm itself, the gui window do pops up. But when I ran it with the main script it only shows this message "runfile('C:/Users/user/Desktop/PY3/Trial_Files/sample_main.py', wdir='C:/Users/user/Desktop/PY3/Trial_Files')". Thanks in advance.
Sorry, I've never seen a message like that. How are you running your files?
@@alandmoorecodes3585 i am using spyder 4. Regarding the code, i believe i copied everything you showed in the video except for the variables. Having no error when running the code makes it so difficult to debug. ☹️
I've never used spyder, but I've heard it has problems with PyQt development. Try running your script from a command prompt, or from IDLE.
@@alandmoorecodes3585 hi, I tried running both Ui_Form and the Main Script on CMD. The former did popup the form but the latter did not. I added some print statements just so I can test its functionality, all of the print statement was printed fine. :(
hi
whats different between PyQt4 and PyQt5
30:40 bro's computer is about to fly
Hey, i get this error about super() when trying to run the code at 27:20
TypeError: super() takes at least 1 argument (0 given)
Does anyone knows what is going on?
If you're using Python3 and it's inside a method of a class, it shouldn't require an argument. Are you using Python2? I can't think of another reason why you'd get that error.
@@alandmoorecodes3585 thank you so much for taking the time to answer me. Yes, i needed an argument (self, LoginWindow) and already solved it. Thanks again so much.
Why not use PyQt5.uic.loadUi to load .ui files directly instead of converting them to .py first?
That's definitely a valid approach too, my focus is on making sure people don't make the mistake of editing the generated Python.
How you know someone knows their stuff? they start the video with "Greetings..." lol after I heard that I sat straight and prepared myself to learn more than I expected lol
how to hide title bar