  
Chapter 4
Examining Labels,
Buttons, and Text Boxes
It's time to get serious about controls! This lesson dives deeply into the three
most common controls and explains how you can use them and manage them in your applications.
By the time you complete this lesson, you will have mastered labels, command buttons,
and text boxes. In addition, you will learn more about how to properly set up a form.
You'll place labels on forms to display information. Command buttons give the
user pushbutton control within applications. Text boxes get information from the
user and process that information inside the program.
The highlights of this hour include
- How to set up focus order
- When the Cancel property triggers events
- How to set a command button's Default property
- Which common properties are important
- How to adjust label sizes for long text values
Control Focus
New Term: The currently active control
at runtime has the focus.
Before looking at this lesson's three controls, you need to master the concept
of focus. Focus is a runtime concept. At runtime, only one window, form (which appears
as a window), or control can have the focus. The window or form currently in focus
is the form whose title bar is highlighted (typically colored blue). The control
with the current focus has an outlined border or caption.
WARNING: Don't confuse
focus with a selected control. At design time you select controls by clicking them
to display their sizing handles. At runtime, one control always has the focus, and
users can change the focus by pressing Tab or Shift+Tab.
Focus is important because the focus determines what the next keystroke or Enter
keypress will activate. For example, consider the screen shown in Figure 4.1. The
figure shows a VB session with several windows, including two windows from the executing
program. The center window is the window with the focus, and you know so because
of the highlighted title bar. Therefore, the center window is the window that receives
keystrokes if and when the user presses a key.
Only one control on the active window can have the focus. The check box labeled
AutoSize has the current focus. Notice the outline around the control. In other words,
despite the other windows on the screen at the time, if the user presses Enter under
Figure 4.1's circumstances, the check box receives that Enter keystroke. If you understand
the way check boxes work, you know that a check box is either checked or unchecked,
meaning that the control determines one of two states. If the user presses Enter,
the AutoSize check box will turn to unchecked.
NOTE: Of course the
user can click the AutoSize check box to uncheck the control. In addition, the user
can click any control in any window on the screen and that control would receive
the click. Focus refers to a window's and control's capability to receive keystrokes.
Figure
4.1. Learning to spot windows and controls
with the focus.
Different controls display the focus in different ways. Only one of Figure 4.2's
seven command buttons can have the focus at any one time. Can you spot the command
button that has the focus? The extra dotted outline around the Images command button
lets you know that the Images command button has the focus and that command button
will receive an Enter keypress if the user presses Enter.
Figure
4.2. One of these seven command buttons
has the focus.
The Mouse and Hotkeys
Need No Focus
As stated earlier, a mouse click does not have to worry about focus. Wherever
the user clicks, the mouse gets the mouse click no matter which window and control
had the focus before the click. In addition, within the active window, the user can
select any control by pressing that control's hotkey. For example, with Figure 4.2
showing, the user could press Alt+X to select the command button labeled Text Box
even though the command button labeled Images has the focus.
An Enter keypress has no inherent location. Without focus, Windows would have
no way to determine where or what the Enter keypress is to activate. With a hotkey,
Windows keeps the hotkey possibility within the window with the focus. In other words,
if two windows appear on your screen and both contain controls with Alt+S keystrokes,
only the active window with the current focus would receive and respond to Alt+S.
The mouse is inherently directional as well as functional. When you click the
mouse button over any window's control on the screen, Windows knows for certain that
you wanted to click over that control. No ambiguity can exist as could happen with
the Enter key. Therefore, focus does not apply to the mouse.
Related Properties
A command button's Cancel property relates somewhat to focus. Whereas the focus
determines which control gets the Enter keypress, a command button's Cancel property
determines which command button gets a simulated Click event when the user presses
the Esc key.
TIP: Often, a command
button used to exit an application or close a dialog box has its Cancel property
set to True. Therefore, you can close such applications or dialog boxes by clicking
the command button or by pressing Esc.
A command button's Default property also relates somewhat to focus. When a form
first appears, the command button with the Default property of True receives the
Click event when the user presses Enter. Another control might have the focus at
that time, but if a command button has a Default property value of True, that button
receives a Click event if the user presses Enter unless the user moves the focus
to another command button before pressing Enter. Only one command button can have
a Default value of True at any one time. As soon as you assign a command button's
Default value True, either at design time or at runtime, any other command button
on the form with a True Default value immediately changes to False. Therefore, Visual
Basic protects a form's integrity by ensuring that only one command button can have
a True Default value at any one time.
Tab Order
The user can move the focus from control to control by pressing Tab (or Shift+Tab
to move the focus backward). If you place eight controls on an application's form,
what focus order will result? In other words, as the user presses Tab, will the controls
get the focus from a left-to-right or from a top-to-bottom order?
VB sets the default focus order in the order you place controls on the form. Therefore,
if you place the top control first and the bottom control second, and then insert
a third control in the middle of the form, the focus order will not move down the
form in the order the user probably expects.
You do not always place controls on a form in the same order in which you want
to set the focus. Therefore, controls that can receive the focus support a property
called the TabIndex property. The first control in the focus order has a TabIndex
property of 0, the second control in the focus order has a TabIndex of 1, and so
on. If you place controls on the form and then later want to modify the focus order,
you need to change the controls' TabIndex property values.
TIP: Not all controls
can actually accept the focus. For example, a label cannot receive keystrokes, so
a label never gets the focus. The Label control does include the TabIndex property,
however. By setting the label's TabIndex value to one more than a text box next to
the label, you can add a hotkey to the label's Caption property, and the user then
has a way to hotkey to the text box. Text boxes do not support hotkey keystrokes
by themselves.
Command Buttons
Command buttons appear in almost every window of every Windows application. Command
buttons determine when the user wants to do something, such as exit the application
or begin printing. In almost every case, you will perform these tasks to add a command
button to an application:
- 1. Locate and size the command button on the form.
2. Change the command button's Name and Caption properties. (The Caption property
holds the text that appears on the command button.)
3. Add code to the command button's Click event procedure.
Although the command button control supports 36 properties, you'll only set the
Name and Caption properties in most cases. In addition, although command button controls
support 15 events, you'll only write code for the Click event in most cases. After
all, a command button resides on most forms just so the user can click the button
to trigger some event that the user is ready to start.
NOTE: By the way,
you can set some properties only at design time (such as a control's Name property),
you can set some properties both at design time and at runtime inside event procedures
and other module code (such as a caption), and you can set some properties only at
runtime from within the program (such as a list box's entries). All of a control's
properties that appear in the Properties window are settable at design time, and
some of those you can set at runtime as well. As you learn more about Visual Basic,
you will become familiar with the properties you can set only at runtime.
Although you'll set the command button's Name and Caption properties most of the
time, setting the Caption property often requires that you change the font to increase
or decrease the text size and style on the caption. Of course, you might want to
center the caption text or, perhaps, left-justify or right-justify the text, so you
also might need to change the Alignment property. In reality, you'll also set the
Left, Height, Top, and Width properties when you size and locate the command button
because, as you learned in Hour 3, "Controls and Properties," these properties
update automatically when you place and size controls.
As you can see, although you only seem to set a couple properties for most controls,
the other properties really do play important roles, and you'll almost always end
up setting several properties to finalize your application. Table 4.1 lists some
of the most common command button properties that you'll set.
New Term: An icon is a small graphical
image, stored in a file with the .ICO filename extension, that often appears on toolbar
buttons.
Table 4.1. Common command button properties.
| Property |
Description |
| BackColor |
Specifies the command button's background color. Click the BackColor's palette down
arrow to see a list of colors and click Categorized to see a list of common Windows
control colors. Before the command button displays the background color, you must
change the Style property from 0-Standard to 1-Graphical. |
| Cancel |
Determines whether the command button gets a Click event if the user presses Esc. |
| Caption |
Holds the text that appears on the command button. |
| Default |
Determines if the command button responds to an Enter keypress even if another control
has the focus. |
| Enabled |
Determines whether the command button is active. Often, you'll change the Enabled
property at runtime with code when a command button is no longer needed and you want
to gray out the command button. |
| Font |
Produces a Font dialog box in which you can set the caption's font name, style, and
size. |
| Height |
Holds the height of the command button in twips. |
| Left |
Holds the number of twips from the command button's left edge to the Form window's
left edge. |
| MousePointer |
Determines the shape of the mouse cursor when the user moves the mouse over the command
button. |
| Picture |
Holds the name of an icon graphic image that appears on the command button as long
as the Style property is set to 1-Graphical. |
| Style |
Determines whether the command button appears as a standard Windows command button
(if set to 0-Standard) or a command button with a color and possible picture (if
set to 1-Graphical). |
| TabIndex |
Specifies the order of the command button in the focus order. |
| TabStop |
Determines whether the command button can receive the focus. |
| ToolTipText |
Holds the text that appears as a tooltip at runtime. |
| Top |
Holds the number of twips from the command button's top edge to the Form window's
top edge. |
| Visible |
Determines whether the command button appears or is hidden from the user. (Invisible
controls cannot receive the focus until the running code changes the Visible property
to True.) |
| Width |
Holds the width of the command button in twips. |
Labels
Labels hold the primary text that appears on a form. Often, programmers use labels
to place titles around the form and to label text boxes so users know what to type
into the text box. Visual Basic supports several other ways to put text on forms,
but when you use the Label control, your code can subsequently, at runtime, change
the label's text so that different messages can appear when needed. Figure 4.3 shows
a Form window that contains a label used for the application's title.
Figure
4.3. A label forms the title on this form.
When you place labels on a form, you'll almost always set the Label control's Name
property and type a new Caption value. In addition, you'll want to change the Font
property and possibly the label's color and style. You will rarely write event procedure
code for labels, so a label's overhead is fairly small and the programming effort
required to manipulate labels is minimal.
Table 4.2 lists the most common Label control properties that you'll set as you
work with the Label control.
Table 4.2. Common label properties.
| Property |
Description |
| Alignment |
Determines whether the label's caption appears left-justified, centered, or right-justified
within the label's boundaries. |
| AutoSize |
Enlarges the label's size properties, when True, if you assign a caption that is
too large to fit in the current label's boundaries at runtime. |
| BackColor |
Specifies the label's background color. Click the BackColor's palette down arrow
to see a list of colors and click Categorized to see a list of common Windows control
colors. |
| BackStyle |
Determines whether the background shows through the label or if the label covers
up its background text, graphics, and color. |
| BorderStyle |
Determines whether a single-line border appears around the label. |
| Caption |
Holds the text that appears on the label. |
| Enabled |
Determines whether the label is active. Often, you'll change the Enabled property
at runtime with code when a label is no longer needed. |
| Font |
Produces a Font dialog box in which you can set the caption's font name, style, and
size. |
| ForeColor |
Holds the color of the label's text. |
| Height |
Holds the height of the label's outline in twips. |
| Left |
Holds the number of twips from the label's left edge to the Form window's left edge. |
| MousePointer |
Determines the shape of the mouse cursor when the user moves the mouse over the label. |
| TabIndex |
Specifies the order of the label in the focus order. Although the label cannot receive
the direct focus, the label can be part of the focus order. |
| ToolTipText |
Holds the text that appears as a tooltip at runtime. |
| Top |
Holds the number of twips from the label's top edge to the Form window's top edge. |
| Visible |
Determines whether the label appears or is hidden from the user. |
| Width |
Holds the width of the label in twips. |
| WordWrap |
Determines whether the label expands to fit whatever text appears in the caption. |
Labels can present problems if they receive text that is too large for the label
boundaries. Putting captions in labels seems easy until you think about the effects
that can occur if the label is too large or too small to hold the text. By using
certain property combinations, you can add automatically adjusting labels for whatever
text the labels need to hold.
Suppose that you design a label that contains this long caption:
This label's caption is extremely long-winded, just like the author.
A label is rarely wide enough or tall enough to hold a caption this long. If you
attempt to type text into a label's Caption property that is longer than what fits
within the label's size properties (Left, Height, Top, and Width), one of the following
things can take place, depending on how you have set up the label:
- The text might not fit inside the label, and Visual Basic truncates the text.
Figure 4.4 shows what can happen in this case.
Set the AutoSize property to False if you want the label to remain the same size
and not resize automatically to fit the Caption property value. If the code assigns
long text, the label might not hold the entire caption, but the label will not expand
and get in the way of other controls.
- The label automatically expands downward to hold the entire caption in a multiline
label. Figure 4.5 shows the result.
Figure
4.4. The label cannot display the entire
caption.
Figure
4.5. The label resizes downward to hold
the entire Caption property.
- To expand the label downward when needed to hold the caption, set both the AutoSize
and WordWrap properties to True. Subsequently, if the code changes the caption to
hold a long line of text, the label will expand to display the entire message.
NOTE: Obviously, if
you don't plan to change a label during a program's execution, you can size the label
to fit the Caption property value at design time, and you don't have to worry about
the AutoSize and WordWrap properties. You only need to concern yourself with these
properties if event procedures or other code might possibly change the label's caption.
WARNING: Set WordWrap
to True before you set the AutoSize property to True. If you set AutoSize first,
the label expands horizontally before you have a chance to set the WordWrap property.
- The label automatically expands horizontally across the screen to hold the entire
caption in a long label control. Figure 4.6 shows the result.
Figure
4.6. A horizontally resizing label could
bump off other controls.
- A long label like this is not necessarily a bad label. Depending on the length
of the text that you assign to the label during the program's execution, there might
be plenty of screen space to display long labels. To automatically expand the label
horizontally, set the AutoSize property to True but leave WordWrap set to False.
Text Boxes
Text boxes accept user input. Although several other controls accept user input,
text boxes are perhaps the easiest to set up and respond to. In addition, a text
box is simple for your users to use, and they see text boxes on Windows forms all
the time.
TIP: You can set a default
value at design time or at runtime so that the user initially sees text in the text
box. The user can either change the default text or accept the text by pressing Enter
when the text box comes into focus.
Figure 4.7 shows a running application with two text boxes that accept user input.
Table 4.3 lists the common properties associated with text boxes. By familiarizing
yourself with the properties now, you will be able to more quickly produce applications
as you learn more about Visual Basic.
Figure
4.7. Two text boxes request user
information.
NOTE: As you are beginning
to see, many properties for many controls overlap. Most controls contain Left, Height,
Top, and Width properties as well as the Visible property. Therefore, when you learn
the properties for one control, you are learning properties for many other controls.
When you first began learning Visual Basic just a few hours ago, you may have wondered
how you could learn all the properties that go with all the possible Windows controls.
You can now see that many controls support the same properties, so learning about
the control properties is not as difficult of a task as it may first seem.
WARNING: The Caption
property is the most common property that displays text on a control such as a command
button and a label. Text Box controls do not support the Caption property. The Text
property holds text for Text Box controls.
Table 4.3. Common text box properties.
| Property |
Description |
| Alignment |
Determines whether the text box's text appears left-justified, centered, or right-justified
within the text box's boundaries. |
| BackColor |
Specifies the text box's background color. Click the BackColor property's palette
down arrow to see a list of colors and click Categorized to see a list of common
Windows control colors. |
| BorderStyle |
Determines whether a single-line border appears around the text box. |
| Enabled |
Determines whether the text box is active. Often, you'll change the Enabled property
at runtime with code when a text box is no longer needed. |
| Font |
Produces a Font dialog box in which you can set the Text property's font name, style,
and size. |
| ForeColor |
Holds the color of the text box's text. |
| Height |
Holds the height of the text box's outline in twips. |
| Left |
Holds the number of twips from the text box's left edge to the Form window's left
edge. |
| Locked |
Determines whether the user can edit the text inside the text box that appears. |
| MaxLength |
Specifies the number of characters the user can type into the text box. |
| MousePointer |
Determines the shape of the mouse cursor when the user moves the mouse over the text
box. |
| MultiLine |
Lets the text box hold multiple lines of text or sets the text box to hold only a
single line of text. Add scrollbars if you wish to put text in a multiline text box
so your users can scroll through the text. |
| PasswordChar |
Determines the character that appears in the text box when the user enters a password
(keeps prying eyes from knowing what the user enters into a text box). |
| ScrollBars |
Determines whether scrollbars appear on the edges of a multiline text box. |
| TabIndex |
Specifies the order of the text box in the focus order. |
| TabStop |
Determines whether the text box can receive the focus. |
| Text |
Holds the value of the text inside the text box. The Text property changes at runtime
as the user types text into the text box. If you set an initial Text property value,
that value becomes the default value that appears in the text box when the user first
sees the text box. |
| ToolTipText |
Holds the text that appears as a tooltip at runtime. |
| Top |
Holds the number of twips from the text box's top edge to the Form window's top edge. |
| Visible |
Determines whether the text box appears or is hidden from the user. |
| Width |
Holds the width of the text box in twips. |
TIP: If you are unsure
how to use a particular control's property, click the property in the Properties
window and press F1 to read the online help. In addition to a detailed help screen
that describes the property, such as the one shown in Figure 4.8, many of the help
screens also contain an Example hypertext jump that shows an example of the property
in action.
Figure
4.8. You can press F1 to request help
for any selected property.
Form Properties
Forms have properties that you can and should set when you create an application.
Being the background of your application, the form's properties help set the stage
for the rest of the project. The form supports more property values than the other
controls described in this lesson, but Table 4.4 lists only the most common properties
that you'll need.
New Term: Pixel stands for picture
element and represents the smallest addressable graphic dot on your monitor.
Table 4.4. Common form properties.
| Property |
Description |
| BackColor |
Specifies the form's background color. Click the BackColor's palette down arrow to
see a list of colors and click Categorized to see a list of common Windows control
colors. |
| BorderStyle |
Determines how the Form window appears. The BorderStyle property specifies whether
the user can resize the form and also determines the kind of form you wish to display. |
| Caption |
Displays text on the form's title bar at runtime. |
| ControlBox |
Determines whether the form appears with the Control menu icon. The Control menu
appears when your application's user clicks the Control menu icon. |
| Enabled |
Determines whether the form is active. Often, you'll change the Enabled property
at runtime with code when a form is no longer needed. Generally, only multiform applications,
such as MDI applications, need to modify a form's Enabled property. |
| Font |
Produces a Font dialog box in which you can set the text's font name, style, and
size. |
| ForeColor |
Holds the color of the form's text. |
| Height |
Holds the height of the form's outline in twips. |
| Icon |
Describes the icon graphic image displayed on the taskbar when the user minimizes
the form. |
| Left |
Holds the number of twips from the form's left edge to the screen's left edge. |
| MaxButton |
Specifies whether a maximize window button appears on the form. |
| MinButton |
Specifies whether a minimize window button appears on the form. |
| MousePointer |
Determines the shape of the mouse cursor when the user moves the mouse over the form. |
| Moveable |
Specifies whether the user can move the form at runtime. |
| Picture |
Determines a graphic image that appears on the form's background at runtime. |
| ScaleMode |
Determines whether the form's measurements appear in twips, pixels (the smallest
graphic dot image possible), inches, centimeters, or other measurements. |
| ShowInTaskbar |
Determines whether the form appears on the Windows taskbar. |
| StartUpPosition |
Determines the state (centered or default) of the form at application startup. |
| Top |
Holds the number of twips from the form's top edge to the Form window's top edge. |
| Visible |
Determines whether the form appears or is hidden from the user. |
| Width |
Holds the width of the form in twips. |
| WindowState |
Determines the initial state (minimized, maximized, or normal) in which the window
appears at runtime. |
Summary
Today you have learned the concept of focus. You must know about focus before
working more with Visual Basic controls because focus determines the order of controls
and which controls are active at any one time.
Most of this lesson describes the three fundamental controls that appear on almost
every application's Form window: command buttons, labels, and text boxes. Many of
the control properties overlap between these and other controls so you can easily
master the properties that are important.
The next hour dives head first into the Visual Basic programming language so you
can begin to build applications internally now that you've learned how to design
application windows using the fundamental controls.
Q&A
- Q How do I know which control has the focus?
A Generally, you'll quickly learn to recognize focus once you've worked with
focus a short time. The focus appears different depending on the collection of controls
that appear on the form. Most of the time, the focus appears as a dotted outline
around a caption or an option. You'll know which window has the focus because the
focus window's title bar will be colored and the others' will be grayed out. If you
really cannot determine which control has the focus, press the Tab key a few times.
You will see the focus jump from control to control.
Q How can I learn all the properties?
A People who have written Visual Basic programs for years don't know every property
for every control. The Properties window is always at most one menu away, and it
always displays a control's properties. Therefore, don't worry about learning all
the properties. Generally, if you need to adjust the location, size, look, or behavior
of a control, a property probably exists to handle that operation.
Workshop
The quiz questions and exercises are provided for your further understanding.
See Appendix C, "Answers," for answers.
Quiz
- 1. True or false: A selected control (the control with its sizing handles
showing) is the control with the focus.
2. True or false: When the user clicks the mouse over a control in a window that
does not have the focus, the clicked control still gets the focus.
3. Which control works best for titles: labels or text boxes?
4. What can you do to close a Form window when the user presses Esc?
5. Which property disables a text box from triggering events when the user types
or clicks the text box?
6. Why do you think labels fail to support a GetFocus event?
7. What happens if you set a label's AutoSize property to True before setting
the WordWrap property to True if the label holds a long caption value?
8. Why should you avoid adding too many autosizing labels to the form at one
time?
Exercises
- 1. Write a Visual Basic application that displays an appropriate form
title and asks the user for his first and last names in two separate text boxes.
Add a command button that terminates the program when the user clicks the command
button, presses the command button's hotkey, or presses Esc.
2. Create an application with five command buttons. Reverse the focus order so
that when you run the application and press the Tab key several times, the focus
order flows upward through the command buttons.
3. Write an application that displays three labels with the same long label Caption
property in each. Don't display the entire caption in the first label. Display the
caption horizontally in the second label. Display the caption vertically down the
window in the third label. You may have to expand the Form window to its full size
(perhaps by setting the Form window's WindowState property to 2-Maximized).
  
|