dale roberts introduction to visual programming dale roberts, lecturer computer science, iupui...
TRANSCRIPT
Dale Roberts
Introduction to Visual ProgrammingIntroduction to Visual Programming
Dale Roberts, LecturerComputer Science, IUPUIE-mail: [email protected]
Department of Computer and Information Science,School of Science, IUPUI
Fall 2003
Dale Roberts
Event Driven Processing
Application Level ProgrammingApplication Level Programming
Uses widget sets and style guidelines to create Uses widget sets and style guidelines to create application GUIs. Examples: Motif, MFC, Qt, GTK, application GUIs. Examples: Motif, MFC, Qt, GTK,
etc.etc.
Graphical Systems ProgrammerGraphical Systems Programmer
Person who implements the widget sests and Person who implements the widget sests and windowing systems abovewindowing systems above
Dale Roberts
Programming ParadigmsProgramming Paradigms
By now, you have been exposed to two By now, you have been exposed to two programming paradigms:programming paradigms:
Functional ProgrammingFunctional Programming
Object-oriented ProgrammingObject-oriented Programming
Can you explain their differences in terms of:Can you explain their differences in terms of:How to decompose a problem?How to decompose a problem?
How to express control?How to express control?
Dale Roberts
Functional DecompositionFunctional Decomposition
How do to decompose a problem?How do to decompose a problem?Top-down functional decomposition approach.Top-down functional decomposition approach.
Step-wise refinementStep-wise refinement
Successive versions of algorithms written in pseudo-codeSuccessive versions of algorithms written in pseudo-code
Problem is divided into smaller subproblemsProblem is divided into smaller subproblems
Each “decomposition” is a function call.Each “decomposition” is a function call.
Keep decomposing until functions are close enough to Keep decomposing until functions are close enough to target language to code.target language to code.
How do you express control?How do you express control?Each step is a function call.Each step is a function call.
Flow of control statements are used within functionsFlow of control statements are used within functions
Dale Roberts
Object-Oriented DesignObject-Oriented Design
How do to decompose a problem?How do to decompose a problem?Bottom-up building block approach.Bottom-up building block approach.
Identify objects needed to solve the problem.Identify objects needed to solve the problem.
Create an Abstract Data Type implemented with objectsCreate an Abstract Data Type implemented with objects
Identify how values are represented in private data members.Identify how values are represented in private data members.
Define operations that act upon values as public member functions.Define operations that act upon values as public member functions.
Encapsulate implementation details within the class.Encapsulate implementation details within the class.
How do you express control?How do you express control?Use UML to define relationships between classes.Use UML to define relationships between classes.
Flow-of-control between classes is relatively unstructured.Flow-of-control between classes is relatively unstructured.
Must still define a client that uses classes to solve a problem.Must still define a client that uses classes to solve a problem.
Client is usually responsible for user-interaction, not classes.Client is usually responsible for user-interaction, not classes.
Stratifies application into presentation, processing, and data layers.Stratifies application into presentation, processing, and data layers.
Dale Roberts
Event-driven ProgrammingEvent-driven Programming
Event-driven programming is the standard Event-driven programming is the standard approach to creating graphical user interfaces approach to creating graphical user interfaces (GUIs)(GUIs)
An event-driven program is object-orientedAn event-driven program is object-orientedNot a new programming “paradigm”Not a new programming “paradigm”
Object-oriented programming was originally development to Object-oriented programming was originally development to implement graphical objects within GUI operating systemsimplement graphical objects within GUI operating systems
However, top-level control is expressed differentlyHowever, top-level control is expressed differentlyThe user is the top-level loopThe user is the top-level loop
Think of Word, or a game programThink of Word, or a game program
Every action in your program is a reaction to the userEvery action in your program is a reaction to the userDecompose program in terms of “what will I do if the user does…”Decompose program in terms of “what will I do if the user does…”
User inaction may trigger background actions (e.g. games)User inaction may trigger background actions (e.g. games)
Dale Roberts
Detecting Asynchronous EventsDetecting Asynchronous Events
PollingPollingRepeatedly read input devices in an infinite loopRepeatedly read input devices in an infinite loop
Interrupt-drivenInterrupt-drivenHardware-triggered context-switching in response to user-Hardware-triggered context-switching in response to user-events events
Event-drivenEvent-drivenExplicit event waitingExplicit event waitingCall-back functions (i.e. signals) in response to user Call-back functions (i.e. signals) in response to user eventsevents
Qt uses event-driven processing.
Dale Roberts
Method #1 PollingMethod #1 Polling
Interaction is governed by a simple loop:Loop forever:
{
read input
respond to input
}
What limitations does this have?
Does it have any advantages?
Dale Roberts
Method #2 Interrupt-driven ProcessingMethod #2 Interrupt-driven Processing
1. Enable device, then
2. proceed with “background” processing until an interrupt is received, at which point
3. Save state (context-switch)
4. Respond to input
5. Restore state and go to step #2.
What advantages/disadvantages does this have?
Dale Roberts
Method #3: Event-driven ProcessingMethod #3: Event-driven Processing
Interaction is once again governed by a loop:
Loop forever:
{
if (event) then
respond
else
do (one unit of) background
processing or
go to sleep (for one unit)
}
Dale Roberts
Event-driven Processing (cont)Event-driven Processing (cont)
All major GUI packages (Motif, MGC, Qt, GTK, All major GUI packages (Motif, MGC, Qt, GTK, Java AWT, …) are event driven.Java AWT, …) are event driven.
Why?Why?More portable than interrupt-driven.More portable than interrupt-driven.At the expense of what?At the expense of what?
More efficient than pollingMore efficient than pollingmost do have polling commandsmost do have polling commands
Can rely on operating system to do time-slicingCan rely on operating system to do time-slicingcontext-switching is very hardware/operating system specific.context-switching is very hardware/operating system specific.
Dale Roberts
Events / SignalsEvents / Signals
Any event-driven graphics package has devices that can signal events
In old standards, this was limited to hardware devicesIn newer packages (e.g. Qt), any widget can signal events; the (hardware) mouse is the same as a (software) slider or button.
Generally, the event tells youWhich device/widget signaled the eventSome “measure” giving the new state
E.g., whether a mouse button was depressed or released
Warning: old systems tend to use the term “events”while newer systems may call them signals (e.g. Qt)
Dale Roberts
Call-back Functions / SlotsCall-back Functions / Slots
A call-back function is an application-specific function called in response to an event
In Qt, these are called “slots”, but this term is unique to Qt
Generally, the “measure” of the event is passed as an argument
The main loop of a GUI program is:Wait for an event
Call the associated call-back function
Return to the top of the loop
Dale Roberts
GUI API Event LoopsGUI API Event Loops
Loop forever:
{
if (input) then {
find out which application receives the event;
invoke the callback function;
}
else
select one application with a
background callback function;
invoke background callback;
}
Dale Roberts
Pick Correlation
The process of selecting which window (or application) an event belongs to is called pick correlation
Pick correlation is usually object-oriented:Every window knows where its children are
children send parents a message when they move, etc.
The top-level window assigns events to children
Child processes mayhandle the event through a call-back; or
ask their children “is this yours”?
Dale Roberts
Hiding the Main Loop
Modern widget packages (like Qt) hide the main loop from the programmer.
Programmers declare signalsi.e. what events to respond to
Programmers define slotsi.e. how to respond to events
Programmers connect signals to slots
The main loop (wait for signal / call slot / loop) is part of the widget package
Programmers call the main loop, but can’t alter it, other than through signals and slots
Dale Roberts
Example: A Main Loop in Qt
int main (int argc, char* argv[])int main (int argc, char* argv[])
{{
QApplication app( argc, argv);QApplication app( argc, argv);
GUI main( &app, &state)GUI main( &app, &state)
app.setMainWidget( &main);app.setMainWidget( &main);
main.Show();main.Show();
return app.exec();return app.exec();
}} Where’s the program? GUI is a widget. The GUI class defines signals and slots, and the GUI’s constructor connection them…
Dale Roberts
What (really) are widgets?What (really) are widgets?
The objects in an object-oriented GUI are called The objects in an object-oriented GUI are called widgetswidgets..Every widget:Every widget:
Knows its location (for pick correlation)Knows its location (for pick correlation)Knows whether of not its visibleKnows whether of not its visibleKnows how to resize itselfKnows how to resize itselfKnows how to redraw itselfKnows how to redraw itselfKnows its “children” widgets (if it’s a container)Knows its “children” widgets (if it’s a container)Has call-back functions (slots) for handling events Has call-back functions (slots) for handling events (signals)(signals)
Every window is a widgetEvery window is a widgetNot all widgets are windowsNot all widgets are windows
Dale Roberts
Examples of widgetsExamples of widgets
Text editing windows (canvases)Text editing windows (canvases)
Push buttonsPush buttons
MenusMenus
SlidersSliders
Radio buttonsRadio buttons
LED displaysLED displays
BordersBorders
Dale Roberts
Building a GUIBuilding a GUI
Every application has a top-level widgetEvery application has a top-level widgetIn Qt, the top-level widget is called QApplicationIn Qt, the top-level widget is called QApplication
QApplication implements the main signal/slot loopQApplication implements the main signal/slot loop
QApplication is a widget but not a windowQApplication is a widget but not a window
QApplication in turn has a single top-level windowQApplication in turn has a single top-level window
Inside is a hierarchy of lesser widgets:Inside is a hierarchy of lesser widgets:frames, etc., for grouping and position widgetsframes, etc., for grouping and position widgets
low-level widgets:buttons, pop-up menus, etc.low-level widgets:buttons, pop-up menus, etc.
Call-back functions (signals) are attached to implement Call-back functions (signals) are attached to implement responded to user actionsresponded to user actions
Events are passed by the OS to the application’s Events are passed by the OS to the application’s top-level widget.top-level widget.
Dale Roberts
AcknowledgementsAcknowledgementsSome of the slides were originally written by J. Ross Beveridge, updated by Dale Roberts.