Chapter 02 Slides

Copyright 2014 Pearson Education, Inc.
Chapter 2
Creating Applications with Visual Basic
Topics
Topics
2.1 Building the Directions Application 2.2 Responding to Events 2.3 Modifying a Controls Text Property with Code 2.4 AutoSize, BorderSize, and TextAlign Properties 2.5 Displaying User Messages
Copyright 2014 Pearson Education, Inc. 2
Outline (cont.)
2.6 Clickable Images 2.7 Using Visual Studio Help Debugging Your Application
2.1
Focus on Problem Solving: Building the Directions Application

Request for Directions Application

Request
The manager of the Highlander Hotel has asked you to build an application that displays a map to the hotel
Steps to Create an Application

Steps
Define what the program is to do Visualize application and design user interface List controls needed Define values of each control's relevant properties Create form and other controls using Visual Studio .NET
Steps to Create an Application (cont.)

Write code Save application Compile application Run application Test application Put into production
Application Specification
Application
Displays a map and written directions to the Highlander Hotel
Design a form with
Labels PictureBox Buttons
Write event procedures
1. Define What the Application is to Do

Purpose:
Input: Process: Output:
Display a map of the Highlander Hotel None Display a form Display on the form a graphic image showing a map
2. Visualize and Design User Interface

Sketch of form to be shown
Label
PictureBox
Form
10
3. Determine the Controls Needed
11
4. Define Values of Each Controls Relevant Properties
12
5. Use VS to Create Application

Steps
Launch Visual Studio Create a new project Create a new VB Windows Forms Application Design form Save, compile, run, and test application
13
Launching Visual Studio
14
Visual Studio - Start Page
15
Create a New Project
New Project
16
New Project: VB Windows Forms App
17
Design Window
Controls
Solution Explorer Design Window
Object Box
Toolbox
Properties Window
Values Names
18
Use VS to Create Application

Establish the Form
Set Text property Add Label control
Position and resize it on form Set Text, TextAlign, AutoSize, and Font properties
Add PictureBox control

Position and resize it on form Set Image property to HotelMap.jpg
Select Resource/Local Resource/Import
Use VS to Create Application (cont.)

Run the application Close and save the application
20
Directions Application GUI
Save All
Sizing Handles
21
Building the Application

Before running the application
Save all files in the application Build the solution to check for syntax errors, use menu to
Build/Build Solution - or - Build/Rebuild Solution
22
Build/Build Solution
Build Solution
23
Build Results
Build Results
Running the Application

To run the application, use
Debug/Start Debugging menu - or - Start Dropdown List - or - Start Icon
25
Debug/Start
Start Debugging
26
Start Icon
Start Debugging
27
Application Running
28
The Directions Application Running
29
Visual Basic Modes

Visual Basic modes
Design mode
Mode in which you create the application Also known as design time
Run mode
Executes application in the Visual Studio environment Also known as runtime
30
Visual Basic Modes (cont.)

Break mode
Momentarily suspends execution of a running application For testing and debugging purposes
31
Solution and Project Organization

Solution
Container that holds Visual Studio projects Each time you create a new project, you will also create a new solution to hold it
32

Solution folder
Created for each new project Contains
Project folder Solution file (.sln)
Double-clicking the solution file will load the project in Visual Studio
33

Project folder
Contains
Files and folders generated by Visual Studio Project file (.vbproj)
Double-clicking the project file will also load the project in Visual Studio
34
Project Organization on Disk

User creates new project in Visual Studio
Solution and folder are created at same time with same name as project
Solution file (.sln)
The project belongs to the solution

Project file (.vbproj)
Solution may contain multiple projects
35
Project Organization
Solution
Project
36
Default Locations
Tool/Options/Projects and Solutions/General

Slide 2- 37
37
To Open an Existing Project

With Visual Studio running
Use Start Page to open the project
If start page is not visible, click VIEW/Start Page Click Open Project link or Select name of project in Recent Projects list
38
Open a Project Using Start Page
Open
39
To Open an Existing Project

With Visual Studio running
Click FILE/Open Project
Locate either solution (.sln) or project (.vbproj) file
Click FILE/Recent Projects and Solutions

Select solution file (.sln) or project file (.vbproj) from list
40
Open a Project Using File Open
Open
41
Re-open Project
42
Properties Window
Use Properties Window to
Select controls on Form
Object Box (dropdown list)
View/modify property values of selected object View/modify event handlers for selected object
43
Properties Window (cont.)

Views of properties
Alphabetic (across all properties)
(Name) appears at top of list
Categorized (groups properties by logical use)
44
Properties Window (Alphabetical)
Object Box By Category Alphbetical
45
Properties Window (Categorical)
Object Box By Category Alphbetical
46
Properties Window (Events)
47
Object Box
Object Box
Shows name of selected control Clicking drop-down list displays names of all objects in form Clicking name of object selects it
48
2.2
Focus on Problem Solving: Responding to Events

Modifying the Directions Application

Add the following to the application:
Label containing the written directions Button to display the directions Button to exit the application
50
Controls to Add
Control Type Label Control Name lblDirections Description Displays written directions to the hotel
Button
btnDisplayDirections
When clicked, causes lblDisplayDirections text to appear on the form
Button
btnExit
Stops the application when clicked
51
Control Properties
Label
Name: lblDirections Text: Traveling on I-89,etc Visible: False
Button
Name: btnDisplayDirections Text: Display Directions
Button
Name: btnExit Text: Exit
Application Running
Slide 2- 53
53
Application Running with Directions
Slide 2- 54
54
Adding an Event Handler

To add an event handler
Double click on a control to get the default event handler Opens the code window Add code
55
Adding an Event Handler (cont.)
56
Click Event Handler for btnDisplayDirections
57
Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load ' load directions (a very long string) lblDirections.Text = "From the airport: " & ControlChars.CrLf & "1: Start out going EAST on AIRPORT RD toward DUVAL RD/CR-110. - 0.1 miles" & ControlChars.CrLf & "2: Turn LEFT onto DUVAL RD. - <0.1 miles " & ControlChars.CrLf & "3: Turn RIGHT onto DUVAL RD/FL102 E. - 0.1 miles " & ControlChars.CrLf & "4: Merge onto I-95 S toward JACKSONVILLE. 1.6 miles " & ControlChars.CrLf & "5: Take the SR-9A S exit- EXIT 362A- toward BLOUNT ISLAND. - 0.2 miles " & ControlChars.CrLf & "6: Merge onto I-295 N. - <0.1 miles " & ControlChars.CrLf & "7: Stay STRAIGHT to go onto FL-9A S. - 13.8 miles " & ControlChars.CrLf & "8: Turn SLIGHT RIGHT onto ST JOHNS BLUFF RD S. - 1.9 miles " & ControlChars.CrLf & "9: Turn LEFT onto BEACH BLVD/US-90 E/FL-212 E. - 1.2 miles " & ControlChars.CrLf & "10: Turn LEFT onto HUFFMAN BLVD. - <0.1 miles " & ControlChars.CrLf & "11: End at 11901 Beach Blvd Jacksonville, FL 32246-6624, US" ' hide directions lblDirections.Visible = False
Application Code
' show Display Directions button btnDisplayDirections.Visible = True

' hide Hide Directions button btnHideDirections.Visible = False
Copyright 2014 Pearson Education, Inc. End Sub 58
Private Sub btnDisplayDirections_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnDisplayDirections.Click lblDirections.Visible = True
Application Code (cont.)
btnHideDirections.Visible = True btnDisplayDirections.Visible = False
End Sub
Private Sub btnExit_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnExit.Click ' end application Close() End Sub Private Sub btnHideDirections_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnHideDirections.Click lblDirections.Visible = False btnHideDirections.Visible = False btnDisplayDirections.Visible = True End Sub
Source Code (VB)
60
Syntax for Assignment Statement

To assign a value to a property
ControlName.PropertyName = value
where
ControlName.PropertyName receives value Equal sign (=) is assignment operator value is being assigned
61
Syntax for Assignment (cont.)

Example
lblDirections.Visible = True Assigns value True to Visible property of lblDirections control Causes text of lblDirections control to become visible to user
62
Switch Between Windows

Use tabs to switch to
Designer window, click Form1.vb [Design] tab Code window, click Form1.vb tab
63
Switch Between Windows (cont.)

Use Solution Explorer to switch to
Open Code window
64
Switch Between Windows (cont.)

Use View menu
Then select either Code or Designer window
Use keyboard
Shift + F7 to open Designer window Ctrl + Alt + 0 to open Code window
65
Click Event Handler for btnExit
66
Comments
Comment (or remark)
Is short notes that you can write in the applications code to explain what code does Starts with an apostrophe (') and anything appearing after the apostrophe, to the end of the line, is ignored by the compiler
67
Comments (cont.)
May be inserted at the end of a programming statement
68
Use VS to Update Application

Update
Place label and buttons on form Enter code for event handlers Test application
69
Colors
Colors
BackColor property sets background color ForeColor property sets text color
70
Changing Text Colors

In Properties window
Select color property (BackColor, ForeColor) Click down-arrow button that appears Select color from list
71
Changing Forms Appearance

Form properties
FormBorderStyle
Sizable (default)
Has Maximize, Minimize, and Close buttons May be resized by dragging edges
FixedSingle
Has single line border, Maximize, Minimize, and Close buttons May not be resized
72
Changing Forms Appearance (cont.)
73

MinimizeBox (Boolean)
Hides Minimize button when set to False
Is disabled but shown if MaximizeBox is set to True
MaximizeBox (Boolean)
Hides Maximize button when set to False
Is disabled but shown if MinimizeBox is set to True
ControlBox (Boolean)
Hides all buttons when set to False
74
75
Locking Controls
Locking controls
Prevents controls from being moved or resized during design time To lock
Right-click an empty space on form Select Lock Controls from menu
76
Printing Your Code

To print a projects source code
Open Code window Use menu
Click menu FILE/Print on menu bar
- Or - Use keyboard shortcut

Press Ctrl + P
Using IntelliSense
IntelliSense
Provides automatic code completion as you type programming statements Use arrow keys to scroll through entries Press Tab or Enter key to accept value Example
78
VB Default Settings
Tool/Options/Projects and Solutions/VB Defaults

2.3
Modifying a Controls Text Property with Code

Text Property
Text property
May be changed
While program is running with code Using an assignment statement
81
Modifying Text Property with Code

Suppose a form is established with a label lblMessage whose Text property is: 1 Kilometer = ?
And on a btnFeet button click, we want to change the value of the text property to: 1 Kilometer = 3,281 feet
Modifying Text Property with Code

Private Sub btnFeet_Click() Handles btnFeet.Click ' Display the conversion to feet. lblMessage.Text = "1 Kilometer = 3,281 feet" End Sub
Assigns the string to the right of the equal sign to the Text property of lblMessage
This replaces the previous Text property of lblMessage with the new value shown
2.4
AutoSize, BorderStyle, and TextAlign Properties

AutoSize Property
AutoSize property
Controls whether control will be resized to fit text Values
True (default)
Bounding box will automatically resize itself to fit the amount of text assigned to it
85
AutoSize Property (cont.)

False
Labels size may be changed in Designer window with its sizing handles Bounding box will remain the size it was given at design time Text that is too large to fit in the bounding box will be only partially displayed
86
BorderStyle Property
BorderStyle property
Determines appearance of a labels border Values
None (default)
Label will have no border
FixedSingle
Label will be outlined with a border one pixel wide
Fixed3D
Label will have a recessed 3D appearance
87
TextAlign Property
TextAlign property
Indicates how text is aligned in control Values
TopLeft (default) TopCenter TopRight MiddleLeft MiddleCenter MiddleRight
88
TextAlign Property (cont.)

BottomLeft BottomCenter BottomRight
89
Changing TextAlign with Code

TextAlign property
May be assigned a value in code Values
ContentAlignment.TopLeft ContentAlignment.TopCenter ContentAlignment.TopRight ContentAlignment.MiddleLeft ContentAlignment.MiddleCenter ContentAlignment.MiddleRight
90
Changing TextAlign with Code

ContentAlignment.BottomLeft ContentAlignment.BottomCenter ContentAlignment.BottomRight
Example
91
2.5
Displaying User Messages
92
Displaying Message Boxes

A message box is a small pop-up message window
Sometimes referred to as a dialog box A convenient way to display message to user Displayed by calling MessageBox.Show() User must click OK button to remove message box
93
Displaying Message Boxes (cont.)

Should include a title
MessageBox.Show("Hello World!")
MessageBox dot Show string enclosed in parentheses
94
StatusStrip Control
StatusStrip control
Uses a Label to display program status information and messages to user
Ideal way to display messages that are not system critical Does not force user to click a button to clear message
95
StatusStrip Control (cont.)
StatusStrip
96
Adding StatusStrip and Label to Form

Step 1:
Drag StatusStrip control from Menus & Toolbars section of Toolbox window onto existing form StatusStrip will attach itself to bottom of form This is docking the control

Step 2:
Click the down arrow on the right side of the StatusStrip and select StatusLabel from the drop-down list
98

ToolStripStatusLabel control will be added to StatusStrip
Set (Name) property with a more meaningful name Clear Text property
99
2.6
Clickable Images
100
Click Event Handlers

Click event handlers
Provide code to take whatever action is desired Controls with click event handlers
Buttons PictureBoxes Labels
101
Form1 of Flags Project
Label1
picUSA
picCanada picUK
picAustralia
picBrazil picItaly
lblMessage
btnExit
102
PictureBox Click Event Handler

When PictureBox picUSA is clicked
lblMessage Text property is set to display "United States of America"
Private Sub picUSA_Click() Handles picUSA.Click ' Display United States of America. lblMessage.Text = "United States of America" End Sub
103
2.7
Using Visual Studio Help
104
Visual Basic Help

For Help in Visual Basic, use
F1 key - context sensitive help
Displays information about feature user is currently focused on
Help menu
105
Accessing the Visual Studio Documentation
106
Context-Sensitive Help
Context-sensitive help
Help on a single topic that you are currently working on To initiate
Select an item you need help with in Visual Studio Then press F1 key on keyboard This launches a help screen in your Web browser
107
Context-Sensitive Help (cont.)

Example
To get help on = operator
Select =, then press F1
108
Context-Sensitive Help (cont.)
109
2.8
Debugging Your Application
110
Errors
Errors
Prevent application from operating properly Most applications contain errors or bugs Types
Compile errors Runtime errors
111
Compile Errors
Compile errors
Syntax (form) of code
i.e. Misspelled keywords, incorrect use of operators or punctuation
Visual Basic informs you as soon as code is entered Code in error underlined with jagged blue line Error description appears in Error List window*
*Note: Display Error List window by selecting Error List from View menu option
Syntax Errors
Syntax Errors
113
Compile Errors (cont.)

Compile errors
Description of error will be given in Error List window Display Error List window by selecting VIEW/Error List Double-click error message to position cursor at error in Code window
114
Compile Errors (cont.)
115
Runtime Errors
Runtime error
Occurs while program is running, when VB attempts to perform an operation that can not be executed Creates incorrect results, but do not prevent program from running VB detects some and informs you about them Others you must detect yourself
Note: Always carefully check the operation of your program to be sure that it operates as required
Topics Covered
Topics covered
2.1 Building the Directions Application 2.2 Responding to Events 2.3 Modifying a Controls Text Property with Code 2.4 AutoSize, BorderSize, and TextAlign Properties 2.5 Displaying User Messages
Topics Covered
2.6 Clickable Images 2.7 Using Visual Studio Help 2.8 Debugging Your Application
118

Chapter 02 Slides

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Chapter 02 Slides

Uploaded by

Copyright:

Available Formats

Copyright 2014 Pearson Education, Inc.

Copyright 2014 Pearson Education, Inc.

Copyright 2014 Pearson Education, Inc.

Focus on Problem Solving: Building the Directions Application

Request for Directions Application

Copyright 2014 Pearson Education, Inc.

Steps to Create an Application

Steps to Create an Application (cont.)

Copyright 2014 Pearson Education, Inc.

Write event procedures

Copyright 2014 Pearson Education, Inc.

1. Define What the Application is to Do

Copyright 2014 Pearson Education, Inc.

2. Visualize and Design User Interface

Copyright 2014 Pearson Education, Inc.

3. Determine the Controls Needed

Copyright 2014 Pearson Education, Inc.

4. Define Values of Each Controls Relevant Properties

Copyright 2014 Pearson Education, Inc.

5. Use VS to Create Application

Copyright 2014 Pearson Education, Inc.

Launching Visual Studio

Copyright 2014 Pearson Education, Inc.

Visual Studio - Start Page

Copyright 2014 Pearson Education, Inc.

Create a New Project

Copyright 2014 Pearson Education, Inc.

New Project: VB Windows Forms App

Copyright 2014 Pearson Education, Inc.

Use VS to Create Application

Add PictureBox control

Use VS to Create Application (cont.)

Copyright 2014 Pearson Education, Inc.

Directions Application GUI

Copyright 2014 Pearson Education, Inc.

Building the Application

Copyright 2014 Pearson Education, Inc.

Copyright 2014 Pearson Education, Inc.

Running the Application

Copyright 2014 Pearson Education, Inc.

Copyright 2014 Pearson Education, Inc.

Copyright 2014 Pearson Education, Inc.

Copyright 2014 Pearson Education, Inc.

The Directions Application Running

Copyright 2014 Pearson Education, Inc.

Visual Basic Modes

Copyright 2014 Pearson Education, Inc.

Visual Basic Modes (cont.)

Copyright 2014 Pearson Education, Inc.

Solution and Project Organization

Copyright 2014 Pearson Education, Inc.

Solution and Project Organization

Copyright 2014 Pearson Education, Inc.

Solution and Project Organization

Copyright 2014 Pearson Education, Inc.

Project Organization on Disk

The project belongs to the solution

Solution may contain multiple projects

Copyright 2014 Pearson Education, Inc.

Copyright 2014 Pearson Education, Inc.

Tool/Options/Projects and Solutions/General

To Open an Existing Project

Copyright 2014 Pearson Education, Inc.

Open a Project Using Start Page