Creating GUI Applications in Python using Qt II
log in to bookmark this presentaton
Novice / Tutorial
March 10th 1:20 p.m. – 4:40 p.m.
This tutorial is intended for Python programmers with limited GUI programming experience with PyQt. The course is designed as a follow-on course. By the end of the course students will have an understanding of building main GUI applications, creating tables and lists widgets, using the Qt MVC for complex tables and lists, and using the item-based graphics.
Abstract
Below is an outline of the material to be presented during the class. The examples listed (unless otherwise noted) are developed while in class to show the process and progression of GUI development. - QListWidget Example (15 min) - Creating a simple GUI presenting a directory list with unique icons for files and directories. - QTableWidget Example (15 min) - Converting the QListWidget example into a table with columns for the file name, attributes, and size. - Modify the example to support column sorting - Discuss limitations of the widget (no commas in the file size, no color coded rows, no validation logic for editable fields) - QTableView Example (20 min) - Discussion of Qt's approach to MVC - QTableView - QListView - QTreeView - Rewrite the QTableWidget but provide column sorting and row highlighting. Include radio buttons to color rows greater than 1K, 10K, 100K, or 1M. - QTreeView Example (25 min) - Discussion of the non-MVC, QTreeWidget class. - Present and walk through completed example - Discuss the problems of implementing a file dialog as a tree using the QTreeWidget class. The entire structure must be loaded into memory. - Rewrite the QTableView example but not restrict the data to a single directory. Basically, we will create a file dialog common on most GUI platforms. - Break (20 min) - Introduction of final example (5 min) - The final example we will develop an application that permits the user to load a .png or .jpg image and determine the RGB value and location of a specific pixel within the image. - A discussion of QObject and events (5 min) - How will QGraphicsRectItem receive slot events to move itself if it doesn't inherit from QObject? - Image inspector design using Designer (10 min) - Design with the class a dialog which will contain a QGraphicsView for the main image, a QSpinBox for zoom control, a QLabel for the zoomed image, and a QGroupBox to contain and RGB field and X/Y position. - Implementing the dialog code - Initial functionality (20 min) - Add the code to populate the main QGraphicsView's scene - Add the selection box to the main scene - Incorporate movement to the selection box - Bound the selection box to the dimensions of the scene's image - Creating the zoom QPixmap (20 min) - Copy a portion of the image using the zoom control value which specifies the height/width of the selection area - Draw an exploded, pixelated, view of the image in the QPixmap - Connect the zoom control's signals to a slot controlling the contents of the QPixmap - Add mouse handlers to highlight the selected pixel and populate its RGB and location information - Implementing the main application (15 min) - Layout the application menus in Designer - File-->Open menu - File-->Exit menu - Image-->Pixel inspector menu - Help-->About menu - Application functionality - Connect the pixel inspector to the menu signal - Create a About popup and connect it to the application - Summary