Adding the Details

Adding controls to a form typically involves one or more of these steps:

1. Select the control from the toolbox.

2. Place the control in its proper location.

3. Size the control.

4. Set the control’s properties.

5. Activate the control with Visual Basic code, if needed.

In the steps that follow, you’ll quickly learn how to place controls on the form you've already created. Generally, you perform these steps in one of two ways:

Double-click the control’s icon on the toolbox. Visual Basic places that control in the center of the form. You can then drag the control to its proper location and size the control by dragging its sizing handles in or out.

Click the control’s icon on the toolbox and move the resulting crosshairs mouse cursor to the form where the control is to be placed. Click and hold your mouse button where the control is to start. As you drag the mouse, Visual Basic draws the control’s outline on your form. When you’ve drawn the control at its proper location and size, release the mouse button to place the control.

Follow these steps to spruce up the application you began in the previous section:

1. Double-click the Label control so that Visual Basic places the label in the center of your form. The Label control contains the letter A. (ToolTips pop up to let you know what a toolbox icon is for.) The label is now the selected tool on your Form window editing area, so the sizing handles appear around the label. In addition, the Properties window changes to show the label’s properties, and the toolbar’s location and size coordinate pairs now reflect the label’s measurements. A label displays text on a form. This new label will hold a title banner for your application.

2. Drag the label up the form until it rests approximately 340 pixels from the left edge of the form window and 20 pixels from the top of the form. Again, you can use the Location values in the Properties window to type in exact values if you don’t want to mess with dragging it around.

3. In the Properties window, scroll down to the text control and type your title. The default font and size are a little bland, but you can use the font properties to alter its style, size, and any effects, much as you would do in a word processor. If the text for this box has caused the box to lose its centering, feel free to go back and tweak the positioning of the label.

4. Click the Toolbox button in the upper-left corner to bring back the choices and double-click the toolbox’s Button control to place a button in the center of your form. The icon on each choice in the toolbox should illustrate the purpose of the button. You can also point to any button to see a ToolTip pop up at the mouse pointer that shows the name of the button. Use the other properties to alter the size of the button and the style and size of the font for the button’s text label that you can change from Button1 by typing in the words in the Text Property box.

5. Locate the toolbox’s PictureBox control. Instead of double-clicking to place the control as you did with the label, click the control’s icon once. Move your mouse to the Form window and draw the Image control, trying to first anchor the image at 260 pixels from the form’s left edge and 210 from the form’s top edge. Size the image at approximately 220 pixels wide and 190 pixels high. Again, you can do this by meticulously dragging the handles so that Visual Basic’s ScreenTips pop up, showing you the coordinates of the image. When the coordinates appear at their proper size, release your mouse button to place the image at that size. Or you can type the information into the Location and Size property boxes. (I find the latter option to be much easier.) Figure 20.3 shows the screen at this point. The PictureBox control displays a graphics image when you run the program.

   

   Tip

   The sample application is not exactly centered at this point. You can use some simple math to center align your controls if you wish. Simply divide the size of the form in two. (In this case, the form is 740 pixels, so half would be 370.) Then take the size of your controls, divide them in half, subtract that number from the number you calculated as half the form size, and that should be the first number of the location of your form. It sounds complicated, but when you do it a couple times, it gets easy. So if the label is 300 pixels wide, it should start at 220 pixels in order to be centered.

   Note

   Location pixel coordinates and size pixel coordinates are always specified in pairs. Often, you’ll see such coordinate pairs specified inside parentheses, as in a location value of (250, 280). For the coordinates, such a pair of values would signify that the width is 250 pixels, and the height is 280 pixels.

Now that you’re more familiar with setting property values for controls, even though you may not understand many of the properties yet, you are equipped to set additional properties for the form and controls to finalize the look of the application. After you set appropriate property values, you will add code to connect the controls and make them work together.

Table 20.1 contains a list of properties that you would need to set for the form and the three controls in order to match. Remember that you must select the form or specific control before you can change property values for that form or control. To select the form, click anywhere inside the form or title bar—but not over any of the controls. The Properties window will change to display the form’s properties. Click either the label, command button, or image to select the control, and then you can change one of that control’s properties by clicking the property name and typing the new value.

Finalizing with Code

You can add Visual Basic programming statements to turn your creation into a working, although simple, application. Visual Basic automatically adds the opening and closing statements needed when you write a subroutine, as you’ll see in the following steps:

1. Double-click the command button to open the Code window. A set of beginning and ending statements appears for a new procedure related to the command button that looks like this:

   Click here to view code image

   Private Sub FranPic_Click() Handles FranPic.Click
   End Sub

   These lines are two of the three lines needed for code required by the command button. The Code window works like a miniature text editor, in which you can add, delete, and change statements that appear in your program code.

   Note

   All code appears in procedures, and every procedure requires beginning and ending lines of code that define the procedure’s start and stop locations. Visual Basic automatically adds the first and final lines of many procedures.

2. Press the spacebar three times and type the following line between the two lines that Visual Basic provided for you (specifying your own directory path as it will probably not match the one below):

   Click here to view code image

   ProductPicture.Image = Image.FromFile("C:DocumentsTY Begin 24product1.jpg")

   As soon as you type Image.FromFile, Visual Basic offers pop-up help with the statement’s format. Some Visual Basic statements, especially those with parentheses, such as the ones you see in this statement, require that you type one or more values. Visual Basic pops up the format of these required values so you know how many to enter. You’ll learn more about why these values are required if you decide to pursue the language in more depth. Visual Basic is a large language, and this help comes in handy.

3. Run the program and click the command button. A picture appears, as shown in Figure 20.4. You have successfully completed your first Visual Basic application. You’ve created an application that displays a picture when you click the command button. The application contains code, and its controls all have property values that you’ve set.

4. Click the Close window button to terminate the program. Be sure to save your project before you exit Visual Studio.

Understanding Procedures

Consider the following event procedure for the File, Exit menu option:

Click here to view code image

Private Sub ExitToolStripMenuItem_Click(sender As Object, e As EventArgs)
    Handles ExitToolStripMenuItem.Click
         ' Terminates The Program
          End
    End Sub

By studying this simple procedure, you can learn quite a bit about all event procedures. The Private keyword indicates that the procedure is local to the current form and cannot be called by other form modules. Therefore, if several forms exist in the current Windows application, selecting File, Exit from this form will execute this specific event procedure and not one outside the scope of this form. The opposite of Private is Public, and public procedures are available to any code in the entire application. Such public procedures are known as global procedures because any procedure in the application can call them.

The keyword Sub or Function always follows the Private (or Public) keyword and indicates the type of the procedure. A subroutine is a procedure that always performs work and then returns control to whatever code was executing before the event took place. A function is a procedure that always performs its job when the event takes place and then returns a value to another place in the program that might need that value.

The name of the event procedure specifies exactly which control and event this procedure responds to. The body of the procedure may consist of several lines, but this one happens to include only two lines: a remark and the End statement, which stops the running program. Every procedure ends with an End Sub or End Function statement. The parentheses that follow the procedure name indicate that the code begins a new procedure; sometimes, when one procedure must pass data values to another, you list one or more values separated by commas inside the parentheses. Even if you don’t pass data, you must type the parentheses after every procedure declaration.

Understanding the Language Behind Visual Basic

The language behind Visual Basic has significant differences from the Python you’ve learned to this point, but the concepts are similar: You just need to understand the tweaks you must make to the syntax of loops, conditional expressions, and assignments. Visual Basic also includes several statements that are unique to the Windows environment.

One of the ways that Visual Basic is unique, however, is in its distribution of procedures across different areas of an application. You now know that several small event procedures reside in a form’s Code window to handle any events that occur on that form. Other forms can exist as well, and code appears in them to handle events that occur there. In addition, other files might be part of a complex application. A code module is a file, separate from any form and the form’s associated code, that holds code that you might use in more than one application. Suppose that you write a procedure that prints your company logo at the top of a page. Such a logo would appear before any report that you produce, before any accounting statement, and before anything you print. You could use this procedure in many different applications.

Instead of typing the procedure in every application that needs it, you can put the code in a general-purpose code module that you then can copy into a new code module for all applications that need to produce the logo. You can, from anywhere else in the application, call a Public general procedure with a Call statement such as this:

Click here to view code image

Call logoPrint   ' Detour to the procedure

When the Call statement finishes, execution returns to the statement that follows Call.

Quiz

1. How much code do you have to write to add Internet access to a Visual Basic application?

2. What toolbox control would you use to add menus to a form?

3. Why is it a good practice to change the names of controls from their default names that Visual Basic assigns?

4. What happens when you double-click a toolbox control?

5. What tool do you use to create menus for Visual Basic applications?

6. How does Visual Basic determine which control properties appear in the Properties window?

7. Name one advantage to running a Visual Basic application inside Visual Basic’s environment as opposed to running a compiled application from Windows.

8. Which runs faster: a Visual Basic application running inside Visual Basic’s environment or a compiled Visual Basic application running outside Visual Basic’s environment?

9. What information can you gather from the following Visual Basic procedure’s declaration line?

Private Sub scrMeter_Change()

10. True or false: All Visual Basic procedures reside in the application’s form module.

Answers

1. You don’t have to write any extra code to add Internet access to a Visual Basic application.

2. You use the MenuStrip control.

3. The default names are not meaningful, and when your application uses several controls, you should name those controls with names that you will recognize when maintaining the program so you modify the correct controls when needed.

4. The toolbox control appears in the center of your Form window.

5. The Menu Editor helps you build and test menus.

6. The control you place on a form determines which properties appear in the Properties window.

7. You can debug the application inside the Visual Basic environment.

8. A compiled Visual Basic application is faster than an application run inside the Visual Basic environment.

9. The procedure is private, which means only the enclosing program can access the procedure, the procedure is a subroutine so it does not return any values, and no arguments are passed to the procedure.

10. False. Some procedure code can appear in code modules.