Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Starting Out with Programming Logic & Design Second Edition by Tony Gaddis Chapter 15: GUI Applications & Event-Driven Programming

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 15-2 Chapter Topics 15.1 Graphical User Interfaces 15.2 Designing the User Interface for a GUI Program 15.3 Writing Event Handlers

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Graphical User Interfaces A Graphical User Interface (GUI) allows the user to interact with the operating system and other programs using graphical elements such as icons, buttons, and dialog boxes –Much of the work of a GUI is done through dialog boxes, which are small windows that display information and allow the user to perform actions –In a command line interface, the programs determine the order in which things happen –In a GUI, the user can determine the order – this is called event driven

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Graphical User Interfaces Figure 15-3 A GUI program

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Graphical User Interfaces Creating a GUI Program –Most of the steps are the same –But, the programmer also designs the GUI elements that make up each window –This includes the flow from window to window Figure 15-4 A user interface flow diagram

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Designing the User Interface for a GUI Interface GUI development also includes the program’s windows and all the graphical components –In the past, this was a cumbersome process –Newer languages allow for easier development Using Microsoft Visual Studio –Visual Basic –C++ –C# Using NetBeans and JBuilder –Java

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Designing the User Interface for a GUI Interface Most IDE’s have a toolbox for easy development Figure 15-5 Visually constructing a window in Visual Basic

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Designing the User Interface for a GUI Interface Components are items that appear in a program’s graphical user interface –Button: causes an action to occur when clicked –Label: can display text –Text Box: Allows the user to enter a single line of input –Check Box: Allows one or more options to be selected –Radio Button: Allows only one option to be selected –Combo Box: A dropdown list of items that the user can select an item from, or enter input –List Box: A list from which the user can select an item –Slider: Allows the user to select a value from a range

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Designing the User Interface for a GUI Interface Figure 15-7 Various components in a GUI window

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Designing the User Interface for a GUI Interface Component names are used to identify the components in the program, in the same way variable names are used Figure 15-8 Components and their names

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Designing the User Interface for a GUI Interface Properties can be set on components to modify how it appears on the screen –Sets things like color, size, and position A summary of constructing a window –Sketch the window –Create the necessary components and name them –Set the components’ properties to the desired values

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Writing Event Handlers Event handlers are written to control the GUI –After the windows are designed, event handlers are coded to respond to events when an action occurs, such as clicking a button –Event: an action that takes place within a program –Event handlers: a module that automatically executes when a specific event occurs

Copyright © 2010 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Writing Event Handlers How to write the event handler module Module ComponentName_EventName() The statements that appear here are executed when the event occurs. End Module //an event handler that closes a window Module exitButton_Click() Close End Module