Lecture 5: Event-driven Programming, Graphical User Interfaces - CS-A1123 Basics in Programming Y2 Winter and Spring 2020 Timo Kiravuo, D.Sc ...
←
→
Page content transcription
If your browser does not render page correctly, please read the page content below
Lecture 5:
Event-driven Programming,
Graphical User Interfaces
CS-A1123 Basics in Programming Y2
Winter and Spring 2020
Timo Kiravuo, D.Sc.Individual Project
Project Instructions
• Topic selection is open
• Three topics for CS-A1123
• Spectrum simulation
• Hydrocarbons
• Own topic
• (E.g., use translate to select one of the Finnish ones)
• Project instructions are being translated to English as we goTimetable for the Project
• The topic selection is open on the MyCourses page ma. 3.2.2020 (12:00) –
Fri 7.2.2020 (14:00). Report three most interesting topics.
• General plan and technical plan must be returned by Fri 6.3.2020 (14:00)
• Guidance meeting (the plan demos) by Mon 17.2. – Fri 13.3.2020
• The plans have to be in any case returned a day before the guidance meeting, even if
the meeting was before the deadline
• After the guidance meeting, one can start the project’s coding
• Period IV and the beginning of period V
• Programming, checkpoints Mon 16.3. – Fri 3.4.2020
• The project demos after an approved checkpoint and a completed return,
latest Fri 15.5.2020
• The project must be returned two days (48h) before project demo. Changes made
after that are not taken into consideration.Some Tips
• Graphical user interfaces have lots of features
• Don't try to use all of them
• GUIs are complex
• They are taking care of many things and contain concurrent operations
• Be prepared to use manuals and search engines
• Build the main functionality of the application first
• Leave tweaking the looks as last
• You can spend forever on the looks
• Keep things in separate layers
• UI objects should contain no business logic or file operations
• You should be able to replace your GUI with a text based front end without changing
the actual logic of the applicationEvent-driven Programming
Control Flow in a Program • So far our programs have had a simple control flow from start to end • Loops and branches • Calls to subroutines (functions and methods) • Event-driven programs are controlled by events • E.g., user presses a button on graphical UI, which causes a function to be executed • Control flow is no longer as obvious • Something external causes functions (or methdos) to be called • Event-based architectures are common, e.g.: • Graphical user interfaces • Service Oriented Architecture (SOA), where systems pass messages to each other
Event-driven Programs
• Listener component
• The "main" program, runs a loop waiting for events
• Calls the event handlers according to the event
• Event handlers
• Functions that handle events, as needed
• Sign up with the listener to receive particular events (callback)
• With Python and PyQt these are objects that sign up with the PyQy framework when
created
• Event driven software is possible in most languages
• However, object-oriented languages make it easier
• Each event can be represented independently by its own object
• There is lots more to event-driven architecturesSome Challenges in Event-driven Architecture
• Concurrency
• A second event may be initiated before the first is finished
• Multiple objects of the same type co-existing and co-operating
• Not a problem as long as events don't try to modify same data
• Generally a desired property with systems based on asynchronous communication models
• A data request is sent to another server and the reply will be handled when it comes
• FIFO lists in Python is one way to hold the event objects
• Memory management
• Objects might continue using memory after no longer needed
• Garbage collection integral in Python, but this might crop up with PyQt
• Complexity
• Especially with asynchronous tasks and receipts
• These issues should not be a problem on this course
• Just be aware that no technology is cream and peaches all the timeGraphical User Interfaces with PyQt
User Interfaces with PyQt
• PyQt framework implements the visual and control part of the
software
• Graphical elements are called widgets
• Buttons, pull-down menus etc.
• Also layout widgets, that control how other widgets are presented
• And free form graphics
• Event listener detects when the user interacts with a component
• Activates the component through the callback
self.__button.clicked.connect(self.close)
• Components appear as objects in the program
• Class inheritance is important in defining the capabilities of the objectsWho Does What? • The computer hardware provides the physical interfaces • The operating system receives the input and controls the output • Device drivers • Mouse, keyboard, displays, also network interfaces and so on • The operating system also contains the window manager • Programs can request to have a window • The OS controls the borders of the window, • PyQt has control of the inside of the window • Our software requests PyQt to display various elements and receives events for which we have created a callback
How to use PyQt • Initiate a QApplication to create the listener and provide other framework functions • Create a window with QMainWindow • Populate that window with widgets to get the graphical elements you want • Create the callbacks for various widgets to get the user input
QApplication
• QApplication is the main PyQt object for each application
• Must be initialized for rest of PyQt to do anything
• One application has only one QApplication object
• There may be many windows, components and threads
• Threads are a method for concurrent execution, typical for event based
applications, but not discussed here
• https://doc.qt.io/qtforpython/PySide2/QtWidgets/QApplication.htmlCreating Windows • QMainWindow() creates a new general purpose window • Components can be placed into this window • Often layout components first • Then visible components • Other window types exist, too • E.g, QFileDialog() • Note that windows are provided by the operating system • The programmer and the application are not completely in control • The user may resize the window • The operating system's window manager influences the looks
Graphical Layouts • PyQt QMainWindow has a default layout
Using the QMainWindow
• Add widgets to the main window
class MyWindow(QMainWindow):
...
tb = QToolBar()
menu = QMenu()
tb.addWidget(menu)
self.addToolBar(tb)
• Using the central widget is recommended
• setCentralWidget()Components and Windows • A user interface should usually be generic • Work on many platforms, for different users • Don't forget EU Accessibility Directive • A window will usually have multiple layers of widgets • Some hold others in place • Usually smart to avoid absolute definitions • Fixed coordinates, measurements, letter fonts • Creating multiplatform interfaces is its own skill set
Other layouts • PyQt has several layouts defined, that can be used inside the widgets • QHBoxLayout and QHBoxLayout to simply put widgets in order in a box • QGridLayout to set things up as a grid • Layouts can be used inside layouts • Some components can also be visible • In general, try to avoid too much clutter • UI design is a design art • Often less is more
Drawing Graphics • PyQt supports free form graphics • Vector and raster • Also support for various file formats • QPainter, QPaintEngine for 2D graphics • Support OpenGL (for performance) • Some 3D capabilities, too • With OpenGL • Or use other libraries through APIs • 2D graphics is enough for this course
Exercises
Exercise 5: XXX • PyQt GUI task • Implement the necessary features for a robots game using PyQt • The core of the software is ready • GUI practice for your project • File parsing task • Reading a free format text file
You can also read
