Notes: The Visual Basic Environment

Notes: The Visual Basic Environment Visual Studio is an integrated development environment (IDE), which means that it provides all the necessary tools...
7 downloads 3 Views 376KB Size
Notes: The Visual Basic Environment Visual Studio is an integrated development environment (IDE), which means that it provides all the necessary tools for creating, testing, and debugging software. The Visual Studio Environment There are four main windows in the VB environment:    

Designer Window - where you create the GUI for your application. Solution Explorer Window - A solution is a container for holding VB projects. When you create a new project, a new solution is automatically created. Properties Window - where you examine and change a control’s properties Toolbox - allows you to select the controls you want to use in the application

Solution Explorer Designer Window

Toolbox

Properties Window

To Reset to the Default Layout  

Click Window on the menu bar and then click Reset Window Layout A dialog box will pop up asking Are you sure you want to restore the default window layout for the environment? Click Yes.

Hello World Together, we will create a program that displays the message “Hello World!” to the user. Here is what our application should do: Purpose: To display the message “Hello World!” Input: None Process: When the user clicks a button, display the message Output: Display a message saying “Hello World!”

We will need to visualize the form. The form will need to a label to display the message and a button for the user to click. It should look similar to this:

We will need to add the following controls: Control Type Form Label Button

Control Name Default lblMessage btnDisplayMessage

When the application runs, the Label control will be invisible. It will become visible when the user clicks the button. The Label control has a property named visible that determines whether it can be seen. The Visible Property is a Boolean property, which means it can hold only one of two values: True or False. Our program will need the following event handler: Event Handler Name Description btnDisplayMessage_Click Set the visible property to true when the user clicks the button

Assignment Operator The equal sign (=) is known as the assignment operator. It assigns the value that appears on its right side to the item that appears on its left side. The standard notation for referring to a control’s property in code is ControlName.PropertyName. Example: lblMessage.Visible = True When this statement executes, the value True is assigned to the lblMessage control’s Visible property. As a result of this assignment statement, the lblmessage control becomes visible on the application form. The order of the code is important. The name of the item receiving the value must be on the left side of the = operator. The following statement is wrong: True = lblMessage.Visible

The PseudoCode (which is also the actual code) is: lblDisplayMessage.Visible = True Now we will begin creating the application in Visual Studio. Objectives:  

Create your first Visual Basic Application Learn how to place controls on a form and manipulate various properties

We will complete the following steps together in class:  

Start VS Express for Desktop and click on New Project Make sure Windows Forms Application is selected. Name your project Hello World and make sure it is being saved to your class folder on the network. Click OK.



You screen should now look like this:



With the form selected, change the Text Field in the Properties Pane to be My First Program. this will change the text in the title bar of the form

Note: Changing the form’s Text property changes only the text that is displayed in the form’s title bar. The form’s name is still Form1. 

 



Add a label to your form by clicking on Label in the toolbox pane and dragging it onto your form. o Because the label you just placed on the form is currently selected, the Properties window shows its properties. o Change the text property to Hello World! o Change the name property to lblMessage o Change the font property by click on the ellipsis (…). Click bold under font style and select 16 under size. Click Ok. o Change the visible property to False. The label is still there, but we won’t be able to see it when the program first runs. Add a button to your form by clicking on Button in the toolbox pane and dragging it onto your form and placing it below the label. In the Properties pane: o Change the name of the button to be btnMessage. o Change the button text to Display Message Resize the button to display all the text and resize the form so it is not so large. It should now look like this:

Switching between the Code Window and the Designer Window

When developing a VB application you will often find yourself switching between these two windows. When a form is created in a VB project, the code for that form is stored in a file with the same name as the form, followed by the .vb extension. When Visual Studio is running, you will see tabs at the top of the control window. One of the tabs reads Form1.vb, and another one reads Form1.vb[Design]. You can click on the tabs to switch back and forth between the Code and Designer Windows.



Double click on the Display Message button on the form. This should take us to the code for the form and create a btnMessage_Click event handler for us:



We want to make the message visible when the Display Message button is clicked. Add the following line of code inside the event handler: lblMessage.Visible = True

IntelliSense IntelliSense is a feature of Visual Studio that helps you write code faster. As you type code, you will see IntelliSense boxes popping up regularly. IntelliSense anticipates what you are about to type. For example, after you have “lbl” typed, the IntelliSense listbox shows any label controls found on the form. With an item selected, you can press the tab key on the keyboard to insert it into your code. Comments In Visual Basic, a comment starts with an apostrophe. Anything appearing after the apostrophe, to the end of the line, is ignored by the compiler. Example: ’ Make the directions visible. lblDirections.Visible = True The comment explains in ordinary language what the next line of code does.



Add a comment explaining what this code does:



Remember to add a comment block near the top of the program with the following information. We will do this for every assignment.

Design Mode, Run Mode, and Break Mode Visual Studio has three modes in which it operates as you develop and test an application. The three modes are design mode, run mode, and break mode. Design mode is where you are placing controls on an application’s form or writing Visual Basic code. When you are ready to run an application that you are developing, you can execute it without leaving the Visual Studio environment. This puts Visual Studio in run mode (also known as runtime). The application will be running on the computer, and you can interact with it as the user. In run mode, the compiler will begin compiling the application. If no errors are found, the application will begin executing in run mode. Break Mode is a special mode that allows you to momentarily suspend a running application for testing and debugging purposes. We will learn more about this later. 

In the toolbar, click the run button or press F5.



Test the program to make sure it works. o If it doesn’t work, call me over and I will help you find the problem. o If it does work, call me over to see it, save your program and close Visual Studio

TIP: Save your work often to prevent the accidental loss of changes you have made to your project.