Working with the IDE – Part 3

(Forms and Controls)

 

At this point, you should have opened a new standard EXE project in VB, and your IDE customizations should be in effect.

 

A VB project contains one or more forms and/or modules which make up a complete VB application. By default, VB names the project "Project1", but you can rename the project by going to Project à Project1 Properties on the VB menu, which will open the following dialog box:

 

 

On the General tab of the Project Properties dialog box, let's change the name from "Project1" to prjFirst. When you are done, click OK to dismiss the dialog box.

 

Now that we have the IDE just the way we want it and a proper project name to work under, let's explore the basic windows that comprise the VB IDE.

 

The Form

 

The form is the heart of your VB application; it is the "screen" or "window" that your users will interact with.  You can think of the form as a "canvas" on which you will place the various objects that make up your application.  When you start a new project, VB automatically supplies you with one form to work with; more forms can be added as needed (the first few examples in this manual will only use one form). Before we start adding objects to the form, let's set some of its properties, using the Properties window.

 

The Properties Window

 

The Properties window lets you change the characteristics, or property settings, of the form itself and of visual interface elements on the form.  The Properties window consists of two columns: the first is the name of the property, which you cannot change; the second column, which is the property setting that you can change.

 

Make sure the form is the active window (click on its title bar if necessary), then locate the Properties window. On the Properties window, change the (Name) property to frmFirst, as shown below:

 

 

VB objects are automatically given a "numeric name" (like "Form1", "Form2", etc.).  It is good programming practice to rename these objects to something more meaningful.

 

Change the Caption property to My First Program:

 

 

Note that the title bar of the form changes accordingly:

 

 

 

The Toolbox

 

The toolbox (shown below), consists of the various objects that you will use to design your application.  These objects, called controls, are objects that you see in all standard Windows applications, such as textboxes, command buttons, option (radio) buttons, checkboxes, etc.

 

 

As you move your mouse over a control in the toolbox, a little yellow label, called a "tool tip", will briefly display, telling you the name of the control:

 

 

The controls that you initially see in the toolbox are called intrinsic controls, in that they are "built in" to VB and Windows.  There are also numerous other controls, called ActiveX controls, that can be added to the toolbox as needed.  These ActiveX controls are supplied by Microsoft, third-party vendors, and you can even write your own in VB or another language such as C++.  Various ActiveX controls will be explored as the tutorial progresses.

 

Placing Controls on Forms

 

There are two basic ways to place a control on a form:

 

(1)        Double-click the desired control in the toolbox (a command button was used in the example).  VB automatically places the control in the middle of the form, as shown below:

 

 

            You can then move and resize the control on the form as desired with your mouse.

 

(2)     Click the desired control in the toolbox once.  The mouse cursor becomes a "crosshair" when you move your mouse over the form, and you can draw the control on the form "manually".

 

 

Selecting Multiple Controls

 

Often, it is convenient to select more than one control at the same time. This enables you to apply the same action to the selected controls (such as moving, formatting, and deleting) simultaneously, which can save time.  There are two ways to select multiple controls:

(1)     Click on one control with your mouse.  Then, hold the Ctrl key down on the keyboard, and click the other controls that you want to select.

(2)     You can "lasso" the desired controls with your mouse. Hold the mouse button down, and "sweep" the mouse over the controls you want to select. When you release the mouse, the controls should be selected.

 

Note: To de-select a control in a group of selected controls, Ctrl-click the control.

 

The screen shot below shows three command buttons that have been selected:

 

 

 

Formatting Multiple Controls

 

Often, the controls on your form will be "grouped" logically.  You may have a set of textboxes in one area, a set of option (radio) buttons in another area, a set of command buttons at the bottom, etc.  To create professional-looking forms, these controls should be "lined up" and spaced properly.  The options on VB's Format menu can help you achieve this with relative ease.

 

In this example, with the three command buttons selected, use the Format options shown in the screen shots below (Format à Align à Tops, and Format à Make Same Size à Both). Note: VB will use the last control you selected as a guide.  For example, when you select three controls, the first two will have white selection handles, and the last one will have blue selection handles. If you then say "align tops", the tops of the first two will be aligned with the third.

 

                                      


Two other Format commands I like are Horizontal Spacing à Make Equal (this works with three or more controls – it ensures that the same amount of "white space" exists between all the controls in the selected group) and Center in Form à Horizontally (this centers the set of selected controls on the form, giving you an even left and right margin).  Note: This example uses a horizontal arrangement of controls, but the same principles apply when you have a vertical arrangement and you use the Vertical Spacing options.

 

                                          

 

 

After the formatting commands have been given, the command buttons will look like this: