1. Chapter 8: Writing Graphical User Interfaces
Visual Basic .NET Programming:
From Problem Analysis to Program Design

2. Visual Basic .NET Programming: From Problem Analysis to Program Design

3. Visual Basic .NET Programming: From Problem Analysis to Program Design

4. Visual Basic .NET Programming: From Problem Analysis to Program Design

5. Understanding the Code Generated by the Windows Form Designer
Use drag-and-drop features of Windows Form Designer to create GUIs
Visual programming consists of:
Creating a form
Setting its properties
Adding components
Setting component properties
Adding event handling code
Visual Basic .NET Programming: From Problem Analysis to Program Design

6. Visual Basic .NET Programming: From Problem Analysis to Program Design
Understanding the Code Generated by the Windows Form Designer (continued)
VB .NET generates code that handles details of form design
Specifies attributes and methods that make form work
When creating a form:
Most generated code collapsed under heading “Windows Form Designer generated code”
Begins with #Region directive
Ends with #End Region directive
View by clicking expand node
Generated code is complex
Visual Basic .NET Programming: From Problem Analysis to Program Design

7. Visual Basic .NET Programming: From Problem Analysis to Program Design

8. Exploring the FormDemo Program (continued)
Private keyword
Indicates that method is accessible only within own class
Me keyword
Refers to current object
Parameter list
Identifies variables that receive values when method invoked
Visual Basic .NET Programming: From Problem Analysis to Program Design

9. Exploring GUI Design Principles
Standards that guide creative process of user interface design
Basic principles include:
Creating consistent look and feel
Ensuring ease of use
Minimizing data entry errors
Providing feedback to users
Adhering to standard naming conventions
Visual Basic .NET Programming: From Problem Analysis to Program Design

10. Creating a Consistent Look and Feel
Style and appearance of form
Includes choice of colors and fonts for various controls
Key design goal
Provide consistent look and feel as user moves among various forms
Visual Basic .NET Programming: From Problem Analysis to Program Design

11. Ensuring Ease of Use and Minimizing Data-Entry Errors
Purpose of each control and layout of form should be intuitive
Placement and grouping of controls should be logical
Good practice:
Design input forms to minimize required keystrokes
Visual Basic .NET Programming: From Problem Analysis to Program Design

12. Providing Feedback to the User
Provide feedback to user
When certain actions have been completed
To inform user when data entry errors have occurred
Present feedback in consistent manner
Visual Basic .NET Programming: From Problem Analysis to Program Design

13. Visual Basic .NET Programming: From Problem Analysis to Program Design
Naming Conventions
Adhering to set of naming conventions
Improves program readability
Facilitates program maintenance
Assign meaningful variable names
Change Name property for each control
Variable name should reflect both
Type of control
Purpose of control
Visual Basic .NET Programming: From Problem Analysis to Program Design

14. Visual Basic .NET Programming: From Problem Analysis to Program Design

15. Visual Basic .NET Programming: From Problem Analysis to Program Design

16. Visual Basic .NET Programming: From Problem Analysis to Program Design
Handling Events
Forms are event-driven: the user has to do something (take an action) for an event to happen (e.g. calculate, display)
To create event handling procedure:
Double-click control in Forms Designer window
VB .NET places method header in Code window
Add statements that handle event
Code is added to most commonly used event handler for control
See Ex. 8-1
Visual Basic .NET Programming: From Problem Analysis to Program Design

17. Working with Additional GUI Controls
Other commonly used controls:
Text boxes: See Ex. 8-2
Combo boxes
Check boxes
Radio buttons
Visual Basic .NET Programming: From Problem Analysis to Program Design

18. Using Text Boxes and Combo Boxes
Used to display textual information
Enable inputting of text from keyboard
Property Text: identifies the text contained in the text box
Combo box
Extends functionality of text box
Provides ability to select item from predetermined list of values
Can also type value
Property Text: identifies the text that is displayed by default in the combo box
Visual Basic .NET Programming: From Problem Analysis to Program Design

19. Visual Basic .NET Programming: From Problem Analysis to Program Design

20. Using Check Boxes and Radio Buttons
Check boxes and radio buttons provide ability to select from options
States:
Checked/Selected
Unchecked/Not selected
Check box
Appears as small white box
Usually includes label that identifies purpose
See Ex. 8-4
Visual Basic .NET Programming: From Problem Analysis to Program Design

21. Visual Basic .NET Programming: From Problem Analysis to Program Design

22. Visual Basic .NET Programming: From Problem Analysis to Program Design
Using Radio Buttons
Radio buttons
Appear as small white circles
Have captions that identify purpose
Group of radio buttons
Represents set of related options
Options are mutually exclusive
Visual Basic .NET Programming: From Problem Analysis to Program Design

23. Visual Basic .NET Programming: From Problem Analysis to Program Design

24. Visual Basic .NET Programming: From Problem Analysis to Program Design

25. Visual Basic .NET Programming: From Problem Analysis to Program Design