A Sample Program with Controls

In this section you'll learn more about the TextBox , ComboBox , ListBox , GroupBox , RadioButton , and Button controls by building a program that uses them. In the process you'll learn about the common properties and methods that are associated with these controls. The form for this sample program is shown in Figure 20.4.

Figure 20.4. The form and the controls for the sample program.

There are two text boxes in this form: txtCustomer near the top of the form and txtOrder at the bottom of the form. txtOrder has its Multiline property set to logic True .

A number of other controls are placed on the form, and you will learn about how each of them is used in the following sections.

Combo Boxes

The cmbSandwich control that is shown in the form in Figure 20.4 is a drop-down combo box. Notice the small downward-pointing arrow at the right end of the combo box. When the user clicks this arrow, the combo box expands to reveal the choices associated with the combo box, as shown in Figure 20.5.

Figure 20.5. The options associated with the cmbSandwich control.

Notice that Hamburger , which cannot be seen in the option list in Figure 20.5, is the currently selected item, as displayed in the text box portion of the combo box. If there are more options in the combo box than can be displayed, scrollbars are automatically added to the option list. The text box, however, continues to display the currently selected item from the list.

Programmer's Tip

You can think of a combo box as being built from a TextBox control and a ListBox control. The text box is used to display the item that has been selected from the list of options that are displayed in the list box portion of the control.

The Anchor Property

Most controls have an Anchor property. By default, the Anchor property is set to Top and Left , which means that the position of the control is fixed relative to the top-left edge of the container. The combo box in the program you are creating is contained within a form, and its Anchor property is set to Top and Left , so its location is anchored relative to the form.

Yeah, so what?

Having a control anchored doesn't have any noticeable impact until the user attempts to resize the container (that is, the form). In your form, the upper-left corner of the combo box is 32 pixels down from the top of the form and 130 pixels in from the left edge. If the user attempts to resize the control, your combo box will remain anchored to those coordinates relative to the top-left edge of the form. You can also anchor forms relative to the other edges on the form, but it's fairly standard to reference everything relative to the top-left edge of the form.

The BackColor and ForeColor Properties

You can set the background and foreground colors for many forms. The defaults are often a black foreground and a white background. This is how most text box “like controls are set. However, under certain circumstances, you might want to change the colors, perhaps to draw attention to a combo box. For example, if you wanted to set the background color of the combo box in the sample program, you would move the cursor to the BackColor property field in the Properties window and click the drop-down arrow. This would reveal a set of three tabs: Custom, Web, and System. If you click the Custom tab, your screen should look similar to that shown in Figure 20.6.

Figure 20.6. The Custom tab of the BackColor property.

Near the lower-right corner of the Custom tab is a color palette from which you can choose the background color you want to use. (Your palette might look different from that shown in Figure 20.6 due to hardware differences between your system and mine.) When you click the color you want to use, the background color of the combo box changes to that color. Notice that the background color for the drop-down option list also assumes the new color.

Programmer's Tip

Beginning programmers like to use color in their programs. As a general rule, however, you should think twice before changing the normal foreground and background colors of a control. Microsoft has spent more money than you and I will make in a lifetime selecting colors for its controls, even considering the colors' psychological impacts on the user. Color can draw attention to something, and it can also be a distraction. You should carefully think through your user interface before messing around with the default colors of the Visual Basic .NET controls.

The CausesValidation Property

Setting the CausesValidation property to logic True causes the Validating() and Validated() events to fire when the focus is leaving the control. In general, validation is a process in which you write code to check the input supplied by the user to make sure it is consistent with what you expect the user to enter. You can then add code to these events to check the control's input before the focus is set to the next control in the tab order. If this property is set to logic False , the Validating() and Validated() events are not fired .

Note that the normal sequence of events for a control is Enter() , GotFocus() , Leave() , Validating() , Validated() , and LostFocus() . Although it seems that you might want to use the LostFocus() event to do postinput processing, the Leave() event is a better choice if the CausesValidation property is set to logic False . Under certain conditions, it is possible to lock up the program if focus-type code appears in the LostFocus() event. (Some additional details are provided in the section "The TabIndex Property," later in this chapter.)

The DroppedDown Property

You can set the DroppedDown property to logic True under program control to display the list of items in the combo box. Setting this property to True has the same effect as clicking the arrow icon found to the right of the text area: It causes the option list for the combo box to be displayed.

Why would you use this property? In your sample program, the user types in the name of the customer and then selects the type of sandwich he or she wants. If you add the following statement to the txtCustomer.Leave() event procedure, the combo box displays the list of sandwich types as soon as the user tabs out of the txtCustomer text box:

 cmbSandwich.DroppedDown = True 

This eliminates the need for the user to click the arrow icon in the combo box to see the list of choices. That's the good news.

The bad news is that the normal arrow cursor disappears when it is positioned over the combo box. As the user moves the mouse, the user sees the highlighted choice in the combo box change, but there's no arrow cursor. As soon as the user clicks a choice from the list of options in the combo box, the arrow cursor reappears. This is a good idea gone bad. Removing the arrow cursor while selecting a choice seems very unnatural .

To fix this problem (because I like showing the combo box list automatically), you can add the following statement immediately after the DroppedDown property is set:

 Cursor.Current = Cursors.Arrow  ' Set the current cursor type 

This statement sets the current cursor, which is now invisible because of the DroppedDown statement, to the arrow (default) cursor. With the arrow cursor back on the screen, the selection process from the combo box seems normal once again.

Programmer's Tip

You can change the current cursor to a number of different cursor styles (for example, crosshair, I-beam, hourglass) by using the Cursor.Current statement. For additional details, see the online help under "Cursors Members."

The MaxDropDownItems Property

As you know, when you click on the small arrow icon located at the right end of the combo box text area, the list of items is displayed. The MaxDropDownItems property determines how many items are displayed when the user clicks the arrow icon. The default number of items displayed is 8.

If you have enough real estate on the form, you should consider setting the MaxDropDownItems property to the total number of items to be displayed. For example, in your sample program, nine items are in the combo box list. Using the default value for the MaxDropDownItems property would force the user to scroll the list of items to see all the choices. Simply setting the MaxDropDownItems property to 9 removes the need for the user to scroll the list to see all the choices.

Your users will appreciate not having to scroll combo box lists. As a general rule, the fewer keystrokes and mouse clicks the user has to make, the better. Although changing the MaxDropDownItems property to reveal the complete list is a small thing, collectively small things like this all add up to help make the interface more user friendly.

The Sorted Property

If you set the Sorted property to logic True , the items in the option list are presented in ascending sorted order. The sort is case-insensitive. The default for this property, however, is logic False , which means the items appear in the list in the order in which they are entered. If the Sorted property is logic False , all new items are added to the end of the list.

Programmer's Tip

Both list boxes and combo boxes provide the Sorted property. However, you are not limited to using the Sorted property just for the items in the option list. For example, if you have an array of integers named Vals() and a list box named lstTemp with its Sorted property set to logic True , you could read the unsorted values from Vals() into the list box and then read them back into Vals() in sorted order. If you need a sort routine (as in a coding quiz during a job interview), this is a quick-and-dirty way to get the job done.

Adding Data to a ComboBox or ListBox Control

After you place a ComboBox control on a form and set the properties the way you want them, you need to add the items that will appear in the combo box. The following is the general syntax for this:

  cmbComboBoxObject.Items.  Add("  Add This Item  ") 

This statement adds the quoted string to the Items collection of the combo box. If the Sorted property is set to logic True , the item is entered into the item list in sorted order. If the Sorted property is False , the item is appended to the end of the list.

After all the items are added to the list, you normally want to have a default selection shown in the combo box. You do that with the following statement:

 cmbSandwich.SelectedIndex = 0 

Because the items in the list are zero based, this statement makes the first item in the list the default selection.

The syntax for adding items to a ListBox control and setting its default selection is the same for the ComboBox control. You will learn how to use some of the other properties for the ComboBox and ListBox controls later in the chapter, in the section "Multiple Selections in a List Box."

The TabIndex Property

With the exception of the Form control, any control that can acquire program focus has a TabIndex property. This property determines the order in which the controls are selected when the user presses the Tab key. For a Windows program, user input is normally terminated when the user presses the Tab key. Visual Basic .NET detects when the user presses the Tab key and fires the Leave() event procedure for the control. Because the user is finished entering data into the current control, Visual Basic .NET needs to move the cursor from the present control to the next control. The TabIndex property tells Visual Basic .NET what that next control is.

Programmer's Tip

Earlier versions of Visual Basic use the LostFocus() event to override the tab order by using the SetFocus() method. You should avoid using SetFocus() within LostFocus() because it can lead to a state that can cause the program to stop responding.

Suppose, for example, that you have two text boxes named txtFirst and txtLast for entering a person's name. You want the user to enter the first name first and then enter the last name. You need to set the TabIndex property of txtFirst to 1 and set the TabIndex property for txtLast to 2 . Then, when the user is finished entering the person's first name and presses the Tab key, Visual Basic .NET fires the Leave() event and then examines the tab order of the controls on the form. When Visual Basic .NET sees that txtLast has its TabIndex property set to 2 , it fires the Enter() event for the txtLast control and places the cursor in the txtLast text box.

As you can see, the TabIndex property determines the order in which Visual Basic .NET processes the controls on a form.

Programmer's Tip

By default, Visual Basic .NET sets the tab order in the order in which you placed the controls on the form at design time. You can check the tab order by running the program and pressing the Tab key to observe the sequence Visual Basic .NET follows in giving each control program focus. However, an easier way to see the tab order is to select View, Tab Order while in Design mode. This causes Visual Basic .NET to place a small box on each control, with the control's TabIndex property written in the box. Selecting View, Tab a second time toggles off the TabIndex property values.

Radio Buttons

Two radio buttons are used in your sample program: rbnPlain and rbnToasted . A radio button control is a binary control because it can assume only one of two states: True (that is, checked) or False (that is, unchecked). In the form's Load () event, this statement sets the rbnToasted radio button to its checked status:

 rbnToasted.Checked = True 

So what's the status of the rbnPlain button?

Normally, radio buttons are grouped together to offer a selection of two or more choices. However, only one choice from the list of available radio button choices can be made. This means that selecting one choice automatically turns off any choice that was previously made. Therefore, if rbnToasted is selected in your sample program, rbnPlain must be unselected . After all, either the bread is toasted or it isn't. You can't have it both ways, and that's exactly why you use radio buttons.

Does this mean you must write code to manage unchecking one button if another button is checked? Fortunately, the answer is no. If you place two radio buttons within a GroupBox control, you tell Visual Basic .NET to treat the radio buttons as a set. Therefore, setting the Checked property of one button automatically causes Visual Basic .NET to uncheck the previously checked button. You can use more than two radio buttons in a group box, and the automatic check/uncheck feature wo-rks for all buttons.