I C T IV

Lesson 2.1 Menu Bar and Toolbar

Menus

- contain groups of related commands (also called menu items) that, when selected, cause the IDE to perform specific actions.

Menu Description
File - contains commands for opening projects, closing projects, printing project data, etc. Edit - contains commands such as cut, paste, find, undo, etc. View - contains commands for displaying IDE windows and toolbars. Project - contains commands for managing a project and its files. Build - contains commands for compiling a program.

I C T IV
Menu Description Debug - contains commands for debugging (i.e., identifying and correcting problems in a program) and running a program. Data - contains commands for interacting with databases (i.e., files that store data. Format - contains commands for arranging a forms controls. Tools - contains commands for accessing additional IDE tools and options that enable customization of the IDE. Windows - contains commands for arranging and displaying windows. Help - contains commands for accessing the IDEs help features.

I C T IV

The Solution Explorer Window

The Solution Explorer window - includes a toolbar that contains several icons. show all files icon - displays all the files in the solution.

I C T IV

The Properties Window

I C T IV
The Properties window - displays the properties for a form or control. Properties - specify information such as size, color and position.

Each form or control has its own set of properties; A propertys description is displayed at the bottom of the Properties window whenever that property is selected. The Properties window is crucial to visual programming; it allows programmers to modify controls visually, without writing code.

Advantages of the Properties Window

1. Programmers can see which properties are available for modification and, in many cases, can learn the range of acceptable values for a given property.

I C T IV
Advantages of the Properties Window
2. The programmer does not have to remember or search the Visual Studio .NET documentation for the possible settings of a particular property. 3. This window also displays a brief description of the selected property, helping programmers understand the propertys purpose.
4. A property can be set quickly using this windowusually, only a single click is required, and no code needs to be written.

I C T IV

Simple Program Execution

I C T IV
Steps in Creating the Simple Program Execution

1. Create the new project.

a. Select File > New > Project

I C T IV
b. Click the Visual Basic Projects folder c. From this list, select Windows Application d. Name the project ASimpleProgram e. Create a directory in which the project will be saved on the Project Location Box

f. Click OK to close the New Project dialog.

2. Set the text in the forms title bar. a. The text in the forms title bar is determined by the forms Text property

I C T IV

Setting the forms Text property.

b. Click the properties icon in the toolbar or select View > Properties Window.
c. Click the form to display the forms properties in the Properties window.

I C T IV
d. Click in the textbox to the right of the Text propertys box and type A Simple Program

e. Press the Enter key when finished.

3. Resize the form. a. Click and drag one of the forms enabled sizing handles

I C T IV
The grid on the background of the form is used by programmers to align controls and is not present when the program is running. 4. Change the forms background color.

The BackColor property specifies a forms or controls background color.

I C T IV
a. Click BackColor in the Properties window. b. Click the Custom tab to display the palette (a series of colors). c. Select the box that represents light blue. 5. Add a label control to the form. a. Click the Windows Forms button in the Toolbox. b. Double-click the Label control in the Toolbox c. Double-click the Label control in the Toolbox

Labels display text; The labels default is Label1.

I C T IV
6. Customize the labels appearance. a. Select the label by clicking it.

b. Set the labels Text property to Welcome to Visual Basic!.

c. Resize the label (using the sizing handles) if the text does not fit. 7. Set the labels font size and align its text. 8. Add a picture box to the form.

I C T IV

I C T IV
9. Insert an image.

a. Click the picture box to display its properties in the Properties window. b. Locate the Image property, which displays a preview of the image (if one exists). c. Click the ellipsis button to display the Open dialog.

I C T IV

d. Browse for an image to insert, select it with the mouse and press the Enter key. Supported image formats include PNG (Portable Networks Graphic), GIF (Graphic Interchange Format), JPEG (Joint Photographic Experts Group) and BMP (Windows bitmap).

I C T IV
Once the image is selected, the picture box displays the image, and the Image property displays a preview. To size the image to the picture box, change the SizeMode property to Stretch-Image, which scales the image to the size of the picture box. e. Resize the picture box, making it larger

I C T IV
f. Run the project. We have been working in the IDE design mode (i.e., the program being created is not executing) This mode is indicated by the text Microsoft Visual Basic.NET [design] in the title bar.

While in design mode, programmers have access to all the environment windows (e.g., Toolbox, Properties, etc.), menus and toolbars.
In run mode, the program is executing, and programmers can interact with only a few IDE features. Features that are not available are disabled or grayed out. The text Form1.vb [Design] in the title bar means that we are designing the form visually, rather than programmatically.

I C T IV
If we had been writing code, the title bar would have contained only the text Form1.vb.

Selecting Debug > Start Without Debugging executes the program.

g. Terminate execution. To terminate the program, click the running applications close button (the x in the top-right corner). This action stops program execution and returns the IDE to design mode.