administrivia today interface guidelines MVC event-based programming assignment 4 any questions? exam next Wednesday review slides are posted Monday s class is optional review/intro to Java 1
guidelines each platform defines interface guidelines describe standard look&feel not a standard less stringent than that not an API defines how program should look not how to implement it 2
guidelines many guidelines exist Apple Human Interface Guidelines original widely used, comprehensive defines Mac look and feel constantly updated others have followed Java Look and Feel Design Guidelines OpenStep User Interface Guidelines User Interface Guidelines MS Windows KDE User Interface Guidelines Gnome User Interface Guidelines 3
Aqua HIG current Apple guideline for Aqua 394 pages contents: Part 1: Design Fundamentals The Design Process Characteristics of Great Software Human Interface Design Prioritizing Design Guidelines 4
Aqua HIG contents continued Part 2: The Macintosh Experience The Mac OS X Environment Using Mac OS X Technologies Address Book, Animation,... Speech, User Assistance Software Installation and Software Updates 5
Aqua HIG contents continued Part 3: Aqua Interface User Input Drag and Drop Text Icons Pointers Menus Windows Controls Layout Guidelines 6
private guidelines some companies define their own sometimes called style sheet defines look&feel of their products describe specialization of platform guidelines may violate platform l&f can give common feel across platforms important part of branding 7
Guideline vs. Principles Preece distinguishes guidelines from principles guidelines give specific advice designed to yield specific l&f default button should be colored light blue principles give general guidance must be applied to each decision appropriately layout should follow natural flow 8
just do it this marks the end of design consideration from here we worry about actually building the interface that has been designed 9
UI abstraction need abstraction of interface before designing code many existing models almost all have common ancestor Model-View-Controller developed in Smalltalk 80 early OO system 10
ancient history before gui, apps can be thought of as: input processing output mvc designed to move this into gui controller model view CIS4140-15 MVC 11
Model concept of MVC simple one or more underlying objects provide behaviors of application designed in any traditional manner not user interface code called Model 12
Business model sometimes referred to as business logic business objects business layer provides meaning/definition of data CIS4140-15 MVC 13
View some pieces exported to user each of these provides class to display themselves called View obviously UI code how information is displayed how status of program is displayed 14
Controller some pieces can be controlled by user usually subset of viewed pieces (hard to change what you can t see) each of these provides class to modify themselves called Controller also obviously UI code all user input 15
MVC traditional MVC picture is View Model Controller 16
MVC that really describes single class more realistic for application is Model Model Model View View View Controller Controller Controller 17
MVC example consider a tic-tac-toe board board itself is model remembers which positions have X or O checks to see if there is a winner display (view) shows the state of the board highlights a winning row/column/diagonal control senses click in square CIS4140-15 MVC 18
mvc example - model centric when user clicks on empty position Controller t controller notices click converts x,y click into square on board tells model about change Model model checks for legal move tells view that board has changed View view asks model for current state draws new board CIS4140-15 MVC 19
refining MVC MVC is over-simplistic like many abstractions first issue is view/controller split often want to directly manipulate display one class may serve both roles more often than not still serving two purposes useful to explicitly remember both 20
Controlling view part of control often controls view control what gets shown and how its shown sometimes MVC drawn as View Model Controller 21
mvc example - controller centric when user clicks on empty position Controller t controller notices click converts x,y click into square on board tells model about change Model View model checks for legal move controller tells view about change view asks model for current state draws new board CIS4140-15 MVC 22
PAC model slowly nexus shifting to controller PAC model takes this all the way Presentation-Abstraction-Controls developed by Coutaz Control is now central only connection from abstraction to presentation 23
PAC PAC breaks direct P-A connection Presentation Abstraction Controller 24
MVC communication choice as to meaning of arrows can be direct (calls) can be indirect (events) easiest to implement everything as direct calls need control/view class for each model class forces synchronous behavior 25
callbacks to share control classes use callbacks control class defines callbacks model register call backs to be called by control class under specified circumstances same button code for all controls each button has different callback functions registered by model 26
callbacks callbacks common in C/C++ in C model defines functions setsquare11() setsquare12(),... for each button, add appropriate callback registerbuttoncallback(buttonsq11,setsquare11)... exact details depends on library CIS4140-15 MVC 27
events events takes this one step further whenever interesting occurrence generate an event interested parties listen for events must register interest event announced to all interested parties 28
events events more common in more recent java, c#, many C++ libs, flex,... model listens for events on buttons buttonsq11.addlistener(this)... when a button is clicked actionperformed called on model with event saying which button was clicked CIS4140-15 MVC 29
event advantages events offer 2 notable differences can mostly be seen as advantages many event listeners can register gives more flexibility could have multiple views at once could have multiple pieces controlled still retains anonymous connections advantage of callbacks 30
asynchronous events are also asynchronous event raiser need not wait for listener to finish processing normally required in callback listener can combine multiple events important for performance if updates happen frequently works well across threads UI responsive while application works 31
UI events all modern GUI systems event-based windowing system generates events for mouse clicks for key strokes for window becoming exposed for menu selection etc. 32
using events system sends event to appropriate control for mouse clicks sent to whatever was clicked on if not handled there may propagate to parent 33
focus for keystrokes, event sent to control with focus platforms control focus differently focus window may be last clicked in focus window may be current mouse location window defines focus control within it often part of GUI API 34
programming GUIs programming GUI mostly 2 steps create controls in right place with right label, etc. listen for events register handlers on appropriate controls links up control to underlying application 35
event-based programming event-based programming is very different feel from traditional lots of little actions no overall flow of control for GUI event systems user dialog defines flow specific flow from user actions 36