President Ramon Magsaysay

State University
Iba, Zambales, Philippines
Tel/Fax No.: (047) 811-1683

College of Engineering/Electrical Engineering

COURSE CODE: ACE 223 – ADVANCE COMPUTER PROGRAMMING
2ND Semester of A.Y. 2020-2021

Introduction

This chapter illustrates how many of the Common Controls within the Visual Basic Toolbox
can be used to develop an exciting application interface
Intended Learning Outcomes

A. Shall be able to learn the different common controls in Visual Basic Toolbox.
COURSE MODULE

Chapter 3:
USING CONTROLS
TAB ORDER

• When creating an application interface with multiple controls consider how it can
be navigated without a mouse, by those users who prefer keyboard navigation.
Typically, they will expect to be able to move the focus from one control to another
by pressing the Tab key. It is, therefore, important to allow the focus to move in a
logical order when the Tab key is pressed, by setting the TabIndex property values
of your controls.

1. Place several controls on a Form, then click on the one you want to be first in the
Tab order to select it.

2. Set the TabIndex property value of the selected control to zero so it has first focus.
 3. Repeat for other controls, setting each TabIndex with an ascending value – 1, 2, 3,
and so on.
4. Press the Start button to run the program, then hit the Tab key to see it follow your
chosen order.

USING BUTTON

• The Button control provides the user with an easy way to start an operation, confirm
or cancel a choice, or get help. In Visual Basic, programming code needs to be
added within each Button’s event-handler to determine its function. Also, its
properties need to be set to determine its appearance – Size, Text, Color, Font, etc.
COURSE MODULE

When setting the Text property, you can easily create an access key shortcut by
prefixing the value with an ampersand & character.

1. Select the Button control in the Form Designer then use the Properties window to
modify its Size and Color.

2. Assign a Text property value that is prefixed by an ampersand & character to

create an access key shortcut.

3. Add MsgBox(“Going”) code to the button’s Click event-handler, then run the
program and press Alt + G to test the “Go” button’s access key
 USING TEXTBOX

• The TextBox control is an essential part of most applications, typically providing a

single- line text input area for the user. Greater amounts of text input can be
accommodated in a TextBox if its MultiLine property is set to True, and its ScrollBars
property is set to Vertical.

1. Place a TextBox and a Button control onto a Form.

2. Select the TextBox and use the Properties window to set its ScrollBars property to
Vertical.
3. Click on the Smart Tag arrowed button over the TextBox, or use the Properties
window, to set its MultiLine property to True.
COURSE MODULE

4. Add this statement to the Button’s Click event-handler

MsgBox(“You typed: ” & _
Str ( Len ( TextBox1.Text ) ) & “ characters” )

5. Run the application, type some text into the TextBox, then click the Button to test
the application.

USING COMBOBOX

• A ComboBox control can be used in place of a TextBox to provide an additional

range of text values in a drop-down list. The user can choose one of the listed values
to insert into the text field or type into it directly, just like a regular TextBox. The
ComboBox provides a user-friendly list of anticipated input but occupies only the
same space as a single-line TextBox.
 1. Select the ComboBox control and find its Items property in the Properties window.
2. Click the ellipsis (…) button in its value column to launch the String Collection
Editor.

3. Enter a list of alternatives you wish to offer, adding one on each line, then click the
OK button.
COURSE MODULE

USING LABEL

• A Label control is intended to advise the user, and provides a rectangular area that
is generally used to provide text information. It can also provide simple rectangular
graphics by displaying no text value, and setting its AutoSize and BackColor
properties.

1. Add three Label controls to a Form.

2. Select each Label in turn and, in the Properties window, set the AutoSize property
value to False.

3. Select each Label in turn and, in the Properties window, set the BackColor
property value to your preference.
4. Select each Label in turn and, in the Properties window, delete the Text property
value so it becomes blank.
 USING PICTUREBOX

• The PictureBox control allows images to be added to your application interface.

These can be referenced as local files or imported into your application as a
resource. Adding an image as a resource ensures your application will be portable
when deployed, as it includes its own copy of the image.
COURSE MODULE

1. Add a PictureBox control to a Form, and then select it.

2. Find its Image property in the Properties window then click the ellipsis button […] to
launch the Select Resource dialog box.
3. Check the Project resource file: radio button, then click Import to browse to the
location of the image file.

4. Click OK to import the image file into your application and to place the image in
the PictureBox control

Assessment/Exercises

Practice by doing example given above on how to apply different common toolbox in
visual basic.

Resources and Additional Resources

• Mike McGrath, Visual Basic in easy steps 4th edition.

COURSE MODULE