Chapter Topics 15.1 Graphical User Interfaces 15.2 Designing the User Interface for a GUI Program 15.3 Writing Event Handlers

15.1 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

15.1 Graphical User Interfaces Figure 15-3 A GUI program

15.1 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

15.2 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

15.2 Designing the User Interface for a GUI Interface Most IDE’s have a toolbox for easy development Visually constructing a window in Visual Studio

15.2 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

15.2 Designing the User Interface for a GUI Interface Figure 15-7 Various components in a GUI window

15.2 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

15.2 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

15.3 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

15.3 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