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

Chapter 8: Writing Graphical User Interfaces

Visual Basic .NET Programming:

From Problem Analysis to Program Design

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

Objectives

• Learn about the GUI classes in VB .NET

• Understand the code generated by the Windows Form Designer

• Explore GUI design principles

• Review forms, buttons, and labels

• Handle events

• Work with additional GUI controls


Introducing the GUI Classes in VB .NET

• Form class

– Member of System.Windows.Forms namespace

– Used to implement a window

• GUI classes take advantage of inheritance

– Most are subclasses of Control class

• Inheritance

– Class of objects takes on characteristics of another class and extends them





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


Understanding the Code Generated by the Windows Form Designer (continued)

• VB .NET generates code that handles details of form design

– Called class definition

– Specifies attributes and methods that make form work


Exploring the FormDemo Program

• Class definition – Begins with class header

– Ends with End Class statement

• Class keyword– Identifies first line of code as class header

– Followed by class name

• Public keyword – Class can be used by anyone


Exploring the FormDemo Program (continued)

• Inherits keyword – Indicates name of superclass

• When working in IDE:– 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



• Constructor

– Special method

• Automatically invoked when instance of class is created

– Windows Form Designer provides default constructor for each form

– Method is named New



• MyBase keyword – Refers to superclass of current object

– MyBase.New( ) calls superclass constructor

• Dispose method – Destructor

– Releases system resources

• Container– Object that holds other components



• Friend keyword

– Specifies that object is accessible only within files that compose application

• WithEvents keyword

– Control instance may be source of events

– Events will be handled by methods that include Handles controlName.eventName clause



• 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


Exploring GUI Design Principles

• Many 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


Creating a Consistent Look and Feel

• 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


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

• Form should appear uncluttered• Good practice:

– Design input forms to minimize required keystrokes


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


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



Reviewing Forms, Buttons, and Labels

• All GUI components with visual representation are subclasses of Control class

– Control class is a subclass of Component class

• Set many properties in Properties window

– Can also manipulate properties through code in event handlers




Handling Events

• 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


Handling Events (continued)

• Alternate method for adding event-handling code:

– Press F7 to open Code window

– Select class name from Class Name list box

– Select event from Method Name list box

– Add statements that handle event




Working with Additional GUI Controls

• Other commonly used controls:

– Text boxes

– Combo boxes

– Check boxes

– Radio buttons

– List boxes


Using Text Boxes and Combo Boxes

• Text box

– Used to display textual information

– Enable inputting of text from keyboard

• Combo box

– Extends functionality of text box

– Provides ability to select item from predetermined list of values

• Can also type value





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


Using Check Boxes and Radio Buttons (continued)

• 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





Using List Boxes and Checked List Boxes

• List boxes and checked list boxes

– Provide ability to select one or more items from predetermined list of values

• List box

– Select one or more items from list

• Checked list boxes

– Include check box to left of each item in list




Example 8-5: The Fast Food Menu Program

• For Each statement

– Similar to For Next

– Loops through a collection of items

– Specifies:

• Variable

• Collection


Programming Example: ABC Computers

• Input – Type of processor

– Operating system

– Peripherals desired

– State of residence

• Output – Order summary

– Total cost



Programming Example: ABC Computers (continued)

• Main Algorithm1. Define cost variables at the class level

2. Create an event handler for each control that captures data from the user

3. When the user selects an option from one of the GUI controls, let the event handler for that control:a. Determine the price of that option

b. Calculate total cost and display the order summary


Summary

• VB .NET generates a class definition – Specifies attributes and methods that make forms

work

– Generated code collapsed under heading “Windows Form Designer generated code”

– Generated code is complex

• Constructor – Special method automatically invoked when

instance of class is created


Summary (continued)

• Container

– Object that holds other components

• Look and feel

– Style and appearance of form

– Use standards to ensure consistent look and feel

• Follow naming conventions for controls


Summary (continued)

• Form components include:

– Text box

– Combo box

– Check box

– Radio button

– List box

– Checked list box

Documents

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