(For more resources on Python, see here.)
Let’s take up a project now. We will apply some of the operations we learned in the previous article, to create a simple Thumbnail Maker utility. This application will accept an image as an input and will create a resized image of that image. Although we are calling it a thumbnail maker, it is a multi-purpose utility that implements some basic image-processing functionality.
Before proceeding further, make sure that you have installed all the packages discussed at the beginning of the previous article. The screenshot of the Thumbnail Maker dialog is show in the following illustration.
The Thumbnail Maker GUI has two components:
In short, this is how it works:
Time for action – play with Thumbnail Maker application
First, we will run the Thumbnail Maker application as an end user. This warm-up exercise intends to give us a good understanding of how the application works. This, in turn, will help us develop/learn the involved code quickly. So get ready for action!
python ThumbnailMakerDialog.py
The Thumbnail Maker dialog that pops up was shown in the earlier screenshot. Next, we will specify the input-output paths and various image parameters. You can open any image file of your choice. Here, the flower image shown in some previous sections will be used as an input image. To specify an input image, click on the small button with three dots …. It will open a file dialog. The following illustration shows the dialog with all the parameters specified.
We got ourselves familiar with the user interface of the thumbnail maker dialog and saw how it works for processing an image with different dimensions and quality. This knowledge will make it easier to understand the Thumbnail Maker code.
The Thumbnail Maker GUI is written using PyQt4 (Python bindings for Qt4 GUI framework). Detailed discussion on how the GUI is generated and how the GUI elements are connected to the main functions is beyond the scope of this article. However, we will cover certain main aspects of this GUI to get you going. The GUI-related code in this application can simply be used ‘as-is’ and if this is something that interests you, go ahead and experiment with it further! In this section, we will briefly discuss how the UI code is generated using PyQt4.
Time for action – generating the UI code
PyQt4 comes with an application called QT Designer. It is a GUI designer for QT-based applications and provides a quick way to develop a graphical user interface containing some basic widgets. With this, let’s see how the Thumbnail Maker dialog looks in QT Designer and then run a command to generate Python source code from the .ui file.
Qt Designer shows the details of the selected widget in Property Editor.
pyuic4 thumbnailMaker.ui -o Ui_ThumbnailMakerDialog.py
We learned how to autogenerate the Python source code defining UI elements of Thumbnail Maker Dialog from a Qt designer file.
Have a go hero – tweak UI of Thumbnail Maker dialog
Modify the thumbnailMaker.ui file in QT Designer and implement the following list of things in the Thumbnail Maker dialog.
Double click on this combobox to edit it.
You will need to break layouts, move the spacer around, and recreate the layouts.
After this, create Ui_ThumbnailMakerDialog.py by running the pyuic4 script and then run the Thumbnail Maker application.
I remember deciding to pursue my first IT certification, the CompTIA A+. I had signed…
Key takeaways The transformer architecture has proved to be revolutionary in outperforming the classical RNN…
Once we learn how to deploy an Ubuntu server, how to manage users, and how…
Key-takeaways: Clean code isn’t just a nice thing to have or a luxury in software projects; it's a necessity. If we…
While developing a web application, or setting dynamic pages and meta tags we need to deal with…
Software architecture is one of the most discussed topics in the software industry today, and…