1
2
Introduction to
the Visual
Basic Express
2005 IDE
2007 Pearson Education, Inc. All rights reserved.
2
Seeing is believing.
— Proverb
Form ever follows function.
— Louis Henri Sullivan
Intelligence …is the faculty of making
artificial objects, especially tools to make tools.
— Henri-Louis Bergson
2007 Pearson Education, Inc. All rights reserved.
3
OBJECTIVES
In this chapter you will learn:
The basics of the Visual Studio Integrated Development
Environment (IDE) that assists you in writing, running
and debugging your Visual Basic programs.
Visual Studio’s help features.
Key commands contained in the IDE’s menus and toolbars.
The purpose of the various kinds of windows in the
Visual Studio 2005 IDE.
What visual programming is and how it simplifies and speeds
program development.
To create, compile and execute a simple Visual Basic
program that displays text and an image using the Visual
Studio IDE and the technique of visual programming.
2007 Pearson Education, Inc. All rights reserved.
4
2.1 Introduction
2.2 Overview of the Visual Studio 2005 IDE
2.3 Menu Bar and Toolbar
2.4 Navigating the Visual Studio IDE
2.4.1 Solution Explorer
2.4.2 Toolbox
2.4.3 Properties Window
2.5 Using Help
2.6 Using Visual Programming to Create a Simple
Program that Displays Text and an Image
2.7 Wrap-Up
2.8 Web Resources
2007 Pearson Education, Inc. All rights reserved.
5
2.1 Introduction
• Visual Studio 2005
– Microsoft Integrate Development Environment (IDE)
• Create, run, and debug programs
• Visual Programming
– Create program by dragging and dropping predefined
building blocks into place
2007 Pearson Education, Inc. All rights reserved.
6
2.2 Overview of the Visual Studio 2005
IDE
• Microsoft Visual Basic 2005 Express Edition
– Only support Visual Basic programming language
• Start page (Fig. 2.1)
– A list of links to resources in the IDE and on the internet
• Visual Basic Express Headlines and MSDN (Fig. 2.2)
– This section provides links to information about programming in
VB
• Note: MSDN stands for Microsoft Developer Network
2007 Pearson Education, Inc. All rights reserved.
7
Fig. 2.1 | Start Page in Visual Basic 2005 Express Edition.
2007 Pearson Education, Inc. All rights reserved.
8
Fig. 2.2 | Displaying a Web page in Visual Studio.
2007 Pearson Education, Inc. All rights reserved.
9
2.2 Overview of the Visual Studio 2005
IDE (Cont.)
• Creating a New Project
– New Project Dialog (Fig. 2.3)
• Dialog to choose type of program to build
– Windows Form Designer (Fig. 2.4)
• Design portion of IDE
– Properties
• Change a component of the program (Fig. 2.5)
– Buttons
• Confirm action, change and etc. (Fig. 2.6)
2007 Pearson Education, Inc. All rights reserved.
10
Fig. 2.3 | New Project dialog.
2007 Pearson Education, Inc. All rights reserved.
11
Fig. 2.4 | Design view of the IDE.
2007 Pearson Education, Inc. All rights reserved.
12
Fig. 2.5 | Text box control for modifying a property in the Visual Studio IDE.
2007 Pearson Education, Inc. All rights reserved.
13
Fig. 2.6 | Dialog for modifying a control’s font properties in the Visual Studio IDE.
2007 Pearson Education, Inc. All rights reserved.
14
2.3 Menu Bar and Toolbar
• Menu Bar (Fig. 2.7)
– The bar of where the commands for managing the IDE
and for developing, maintaining and executing programs
are located
• Tool Bar (Fig. 2.9)
– The bar of where the more common commands are located
• Tool Tip (Fig. 2.12)
– Description of a icon
2007 Pearson Education, Inc. All rights reserved.
15
Fig. 2.7 | Visual Studio menu bar.
2007 Pearson Education, Inc. All rights reserved.
16
Menu Description
File Contains commands for opening, closing, adding and saving projects,
as well as printing project data and exiting Visual Studio.
Edit Contains commands for editing programs, such as cut, copy, paste,
undo, redo, delete, find and select.
View Contains commands for displaying windows (e.g., Solution Explorer,
Toolbox, Properties window) and for adding toolbars to the IDE.
Project Contains commands for managing projects and their files.
Build Contains commands for compiling programs.
Debug Contains commands for debugging (i.e., identifying and correcting
problems in programs) and running programs. Debugging is discussed
in detail in Appendix C.
Fig. 2.8 | Summary of Visual Studio 2005 IDE menus. (part 1 of 2.)
2007 Pearson Education, Inc. All rights reserved.
17
Menu Description
Data Contains commands for interacting with databases (i.e.,organized
collections of data stored on computers), which we discuss in Chapter
20, Databases, SQL and [Link].
Format Contains commands for arranging and modifying a form’s controls.
Note that the Format menu appears only when a GUI component is
selected in Design view.
Tools Contains commands for accessing additional IDE tools (e.g., the
Toolbox) and options that enable customization of the IDE.
Window Contains commands for arranging and displaying windows.
Community Contains commands for sending questions directly to Microsoft,
checking question status, sending feedback on Visual Basic and
searching the CodeZone developer center and the Microsoft developers
community site.
Help Contains commands for accessing the IDE’s help features.
Fig. 2.8 | Summary of Visual Studio 2005 IDE menus. (part 2 of 2.)
2007 Pearson Education, Inc. All rights reserved.
18
Fig. 2.9 | Standard Visual Studio toolbar.
2007 Pearson Education, Inc. All rights reserved.
19
Fig. 2.10 | Adding the Build toolbar to the IDE.
2007 Pearson Education, Inc. All rights reserved.
20
Fig. 2.11 | IDE toolbar icon showing additional command.
2007 Pearson Education, Inc. All rights reserved.
21
Fig. 2.12 | Tool tip demonstration.
2007 Pearson Education, Inc. All rights reserved.
22
Fig. 2.13 | Toolbar icons for three Visual Studio windows.
2007 Pearson Education, Inc. All rights reserved.
23
2.4 Navigating the Visual Studio 2005 IDE
• Auto-Hide (Fig. 2.14 – 2.16)
– Space saving feature
• Solution Explorer (Fig. 2.17 – 2.20)
– Provides access to all of the files in a solution
• Toolbox (Fig. 2.21)
– Contains icons representing controls used to customize form
• Properties Window (Fig. 2.22)
– The window to change information about a form or control
2007 Pearson Education, Inc. All rights reserved.
24
Fig. 2.14 | Auto-hide feature demonstration.
2007 Pearson Education, Inc. All rights reserved.
25
Fig. 2.15 | Displaying a hidden window when auto-hide is enabled.
2007 Pearson Education, Inc. All rights reserved.
26
Fig. 2.16 | Disabling auto-hide (“pinning down” a window).
2007 Pearson Education, Inc. All rights reserved.
27
Fig. 2.17 | Solution Explorer with an open project.
2007 Pearson Education, Inc. All rights reserved.
28
Fig. 2.18 | Solution Explorer showing plus boxes and minus boxes for expanding
and collapsing the tree to reveal or hide project files.
2007 Pearson Education, Inc. All rights reserved.
29
Fig. 2.19 | Solution Explorer expanding the My Project file after clicking its plus box.
2007 Pearson Education, Inc. All rights reserved.
30
Fig. 2.20 | Solution Explorer collapsing all files after clicking any minus boxes.
2007 Pearson Education, Inc. All rights reserved.
31
Fig. 2.21 | Toolbox window displaying controls for the Common Controls group.
2007 Pearson Education, Inc. All rights reserved.
32
Fig. 2.22 | Properties window.
2007 Pearson Education, Inc. All rights reserved.
33
2.5 Using Help
• Dynamic Help (Fig. 2.24)
– Excellent way to get information quickly about the IDE
and its features
• Context-Sensitive Help (Fig. 2.25)
– Immediately displays a relevant help article
2007 Pearson Education, Inc. All rights reserved.
34
Command Description
How Do I? Contains links to relevant topics, including how to upgrade programs
and learn more about Web services, architecture and design, files and
I/O, data, debugging and more.
Search Finds help articles based on search keywords.
Index Displays an alphabetized list of topics you can browse.
Contents Displays a categorized table of contents in which help articles are
organized by topic.
Fig. 2.23 | Help menu commands.
2007 Pearson Education, Inc. All rights reserved.
35
Fig. 2.24 | Dynamic Help window.
2007 Pearson Education, Inc. All rights reserved.
36
Fig. 2.25 | Using context-sensitive help.
2007 Pearson Education, Inc. All rights reserved.
37
Fig. 2.26 | Options dialog displaying Help settings.
2007 Pearson Education, Inc. All rights reserved.
38
2.6 Using Visual Programming to Create
a Simple Program Displaying Text and an
Image
• Creating a Simple Program
– Create the new project (Fig. 2.28-2.30)
– Set the text in in the form’s title bar (Fig. 2.31)
– Resize the form (Fig. 2.32-2.33)
– Change the form’s background color (Fig. 2.34-2.35)
– Add a Label control to the Form (Fig. 2.36)
– Customize the Label’s appearance (Fig. 2.37-2.38)
– Set the Label’s font size (Fig. 2.39-2.40)
2007 Pearson Education, Inc. All rights reserved.
39
2.6 Using Visual Programming to Create
a Simple Program Displaying Text and an
Image (Cont.)
• Creating a Simple Program (Cont.)
– Align the Label’s text (Fig. 2.41)
– Add a PictureBox to the form (Fig. 2.42)
– Insert an image (Fig. 2.43-2.47)
– Save the project
– Run the project (Fig. 2.47-2.49)
– Terminate execution
2007 Pearson Education, Inc. All rights reserved.
40
Fig. 2.27 | Simple program executing.
2007 Pearson Education, Inc. All rights reserved.
41
Fig. 2.28 | New Project dialog.
2007 Pearson Education, Inc. All rights reserved.
42
Fig. 2.29 | Save Project dialog.
2007 Pearson Education, Inc. All rights reserved.
43
Fig. 2.30 | Setting the project location in the Project Location dialog.
2007 Pearson Education, Inc. All rights reserved.
44
Fig. 2.31 | Setting the form’s Text property in the Properties window.
2007 Pearson Education, Inc. All rights reserved.
45
Fig. 2.32 | Form with enabled sizing handles.
2007 Pearson Education, Inc. All rights reserved.
46
Fig. 2.33 | Resized form.
2007 Pearson Education, Inc. All rights reserved.
47
Fig. 2.34 | Changing the form’s BackColor property.
2007 Pearson Education, Inc. All rights reserved.
48
Fig. 2.35 | Form with new BackColor property applied.
2007 Pearson Education, Inc. All rights reserved.
49
Fig. 2.36 | Adding a Label to the form.
2007 Pearson Education, Inc. All rights reserved.
50
Fig. 2.37 | Changing the Label’s AutoSize property to False.
2007 Pearson Education, Inc. All rights reserved.
51
Fig. 2.38 | GUI after the form and Label have been customized.
2007 Pearson Education, Inc. All rights reserved.
52
Fig. 2.39 | Properties window displaying the Label’s properties.
2007 Pearson Education, Inc. All rights reserved.
53
Fig. 2.40 | Font dialog for selecting fonts, styles and sizes.
2007 Pearson Education, Inc. All rights reserved.
54
Fig. 2.41 | Centering the Label’s text.
2007 Pearson Education, Inc. All rights reserved.
55
Fig. 2.42 | Inserting and aligning a PictureBox.
2007 Pearson Education, Inc. All rights reserved.
56
Fig. 2.43 | Image property of the PictureBox.
2007 Pearson Education, Inc. All rights reserved.
57
Fig. 2.44 | Select Resource dialog to select an image for the PictureBox.
2007 Pearson Education, Inc. All rights reserved.
58
Fig. 2.45 | Select Resource dialog displaying a preview of selected image.
2007 Pearson Education, Inc. All rights reserved.
59
Fig. 2.46 | Scaling an image to the size of the PictureBox.
2007 Pearson Education, Inc. All rights reserved.
60
Fig. 2.47 | PictureBox displaying an image.
2007 Pearson Education, Inc. All rights reserved.
61
Fig. 2.48 | Building a solution.
2007 Pearson Education, Inc. All rights reserved.
62
Fig. 2.49 | IDE in run mode, with the running program in the foreground.
2007 Pearson Education, Inc. All rights reserved.