Gateways Institute of

Science and Technology

HOW TO USE THIS LEARNER’S MANUAL

1. Answer the diagnostic test before you proceed to the different activities. The diagnostic test
determines how much you know about the lessons and identifies the areas you ought to learn. Your
teacher will check and analyze your score to determine your learning needs;
2. This module contains relevant information and activities. Go over each activity carefully. If you
encounter difficulties, do not hesitate to consult your teacher for assistance through your group
messaging;
3. Do not skip any lesson. REMEMBER that each activity is a preparation for the succeeding activities;
4. Perform the given activities, quizzes and assignments to enrich your knowledge and skills;
5. Write all your answers on a separate sheet of paper;
6. After successfully finishing the tasks, PLEASE RETURN this module with your answers to the quizzes
and tasks given for checking;

7. Your score will be analyzed and will be used by your teacher for the computation of your grades;
8. Lastly, DO NOT mark this MODULE in any way.

Computer Programming (Visual Basic 6.0)

Second Semester
 3rd Quarter Week 3

I. OBJECTIVES:

At the end of the lesson, the learner must be able to:

1. Identify common control and its properties.

2. Handle controls.
3. Identify different uses and application of each controls.
4. Write source codes.
5. Debug source codes.

II. CONTENT

A. LESSON PROPER

WORKING WITH CONTROLS

LESSON 7: The Control Properties

As you have seen at the previous topic, before writing codes to an event procedure for the control to
response to an event, you have to set certain properties for the control to determine its appearance and how
will it work with the event procedure. You can set the properties of the controls in the Properties Window or
at runtime.

Control at Runtime

RUNTIME is when a program is running (or has been executed). That is, when you start a program running in
a computer, it is runtime for that program.

The typical properties window for a form, in the properties window, the item appears at
the top part is the object currently selected. At the bottom part, the items listed in the
left column represent the names of various properties associated with the selected
object while the items listed in the right column represent the states of the properties.

Properties can be set by highlighting the items in the right column tan change them by
typing or selecting the options available.

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
For example, in order to change the caption, just highlight Form1 under the name Caption and change it to
other names as demonstrated in LESSON 6 EXAMPLE 1 Step 6. You may also alter the appearance of the form
by setting it to 3D or flat, change its foreground and background color, change the font type and font size,
enable or disable, minimize and maximize buttons and more.
EXAMPLE: Program to Change Form Background Color and Shape at Runtime

1. Open VB6 Application and create an standard exe application

2. Add a shape on the Form Design ( ). Your Form Design should look like this.

3. Double Click the Form and type the following: (You don’t have to type the Procedure Private Sub …
and end sub):

Private Sub Form_Load()

[Link]
[Link] = vbRed
[Link] = 3
End Sub

4. Press F5 to start the program. Your Form Design at runtime should look like this:

NOTE: The form background changed to Red (vbRed) and from the original shape Rectangle to Circle

5. Save your program inside a folder “Exercise3” and name the project Exercise3

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
LESSON 8: Handling Some of the Common Controls

VB6 Controls

All the Visual Basic Objects or controls can be moved, resized or customized by setting their properties.
Properties can be set at design time by using the Properties window or at run time by using statements in the
program code.

Below is the VB6 toolbox that shows the basic controls.

TextBox

The text box is the standard control for accepting input from the user as well as to display the output. It can
handle string (text) and numeric data but not images or pictures. A string entered into a text box can be
converted to a numeric data by using the function Val(text). The following example illustrates a simple
program that processes the input from the user.

We are not going into the details on how to set the properties this time. However, we would like to stress a
few important points about setting up the properties.

 You should set the Caption Property of a control clearly so that a user knows what to do with that
command.
 Use a meaningful name for the Name Property because it is easier to write and read the event
procedure and easier to debug or modify the programs later.
 One more important property is whether to make the control enabled or not.
 Finally, you must also consider making the control visible or invisible at runtime, or when should it
become visible or invisible.

EXAMPLE:

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
In this program, two text boxes are inserted into the form together with a few labels. The two text boxes are
used to accept inputs from the user and one of the labels will be used to display the sum of two numbers that
are entered into the two text boxes. Besides, a command button is also programmed to calculate the sum of
the two numbers using the plus operator. The program use creates a variable sum to accept the summation
of values from text box 1 and text box 2.

SOURCE CODES:

Private Sub Command1_Click()

'To add the values in TextBox1 and TextBox2
Sum = Val([Link]) + Val([Link])
'To display the answer on label 1
[Link] = Sum
End Sub

Label

The label is a very useful control for Visual Basic, as it is not only used to provide instructions and guides to
the users, it can also be used to display outputs. One of its most important properties is Caption. Using the
syntax Label at Caption, it can display text and numeric data. You can change its caption in the properties
window and also at runtime. At the given example above it was: Number 1, Number 2, Sum, and Calculate.

The Command Button

The command button is one of the most important controls as it is used to execute commands. It displays an
illusion that the button is pressed when the user click on it. The most common event associated with the
command button is the Click event, and the syntax for the procedure is:

Private Sub Command1_Click ()

Statements
End Sub

PictureBox

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
The Picture Box is one of the controls that is used to handle graphics. You can load a picture at design phase
by clicking on the picture item in the properties window and select the picture from the selected folder. You
can also load the picture at runtime using the LoadPicture method.

For example, the statement will load the picture [Link] into the picture box.

EXAMPLE:

In this program, insert a command button and a picture box.

SOURCE CODES:

Private Sub cmd_LoadPic_Click()

[Link] = LoadPicture("C:\Users\Lyths\Documents\images\[Link]")
End Sub

Image

The Image Control is another control that handles images and pictures. It functions almost identically to the
pictureBox. However, there is one major difference, the image in an Image Box is stretchable, which means it
can be resized. This feature is not available in the PictureBox. Similar to the Picture Box, it can also use the
LoadPicture method to load the picture.

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
EXAMPLE:

In this program, we insert a command button and an image control into the form. Besides that, we set the
image Strech property to true.

SOURCE CODES:

Private Sub cmd_LoadImg_Click()

[Link] = LoadPicture("C:\Users\Lyths\Documents\images\[Link]")
End Sub

ListBox

The function of the ListBox is to present a list of items where the user can click and select the items from the
list. In order to add items to the list, we can use the AddItem method.

EXAMPLE:

SOURCE CODES:

Private Sub Form_Load ( )

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
[Link] “Lesson1”
[Link] “Lesson2”
[Link] “Lesson3”
[Link] “Lesson4”
End Sub

ComboBox

The function of the Combo Box is also to present a list of items where the user can click and select the items
from the list. However, the user needs to click on the small arrowhead on the right of the combo box to see
the items which are presented in a drop-down list. In order to add items to the list, you can also use
the AddItem method.

EXAMPLE:

SOURCE CODES:

Private Sub Form_Load ( )

[Link] "Item1"
[Link] "Item2"
[Link] "Item3"
[Link] "Item4"
End Sub

CheckBox

The Check Box control lets the user selects or unselects an option. When the Check Box is checked, its value is
set to 1 and when it is unchecked, the value is set to 0. You can include the statements [Link]=1 to

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
mark the Check Box and [Link]=0 to unmark the Check Box, as well as use them to initiate certain
actions.

EXAMPLE:

The program shows which items are selected in a message box.

SOURCE CODES:

Private Sub Cmd_OK_Click ()

If [Link] = 1 And [Link] = 0 And [Link] = 0 Then
MsgBox "Apple is selected"
ElseIf [Link] = 1 And [Link] = 0 And [Link] = 0 Then
MsgBox "Orange is selected"
ElseIf [Link] = 1 And [Link] = 0 And [Link] = 0 Then
MsgBox "Orange is selected"
ElseIf [Link] = 1 And [Link] = 1 And [Link] = 0 Then
MsgBox "Apple and Orange are selected"
ElseIf [Link] = 1 And [Link] = 1 And [Link] = 0 Then
MsgBox "Apple and Pear are selected"
ElseIf [Link] = 1 And [Link] = 1 And [Link] = 0 Then
MsgBox "Orange and Pear are selected"
Else
MsgBox "All are selected"
End If
End Sub

OptionButton

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
The OptionButton control also lets the user selects one of the choices. However, two or more Option buttons
must work together because as one of the option buttons is selected, the other Option button will be
unselected. In fact, only one Option Box can be selected at one time. When an option box is selected, its
value is set to “True” and when it is unselected; its value is set to “False”.

EXAMPLE:

In this example, we want to change the background color of the form according to the selected option. We
insert three option buttons and change their captions to "Red Background", "Blue Background" and "Green
Background" respectively.

SOURCE CODES:

Private Sub cmd_SetColor_Click ()

If [Link] = True then
[Link] = vbRed
ElseIf [Link] = True then
[Link] = vbBlue
Else
[Link] = vbGreen
End If
End Sub

Shape

To determine the shape of the shape control, we use the shape property. The property values of the shape
control are 0, 1, and 2,3,4,5 which will make it appear as a rectangle, a square, an oval shape, a circle, a
rounded rectangle and a rounded square respectively.

DriveListBox

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
The DriveListBox is for displaying a list of drives available in your computer. When you place this control into
the form and run the program, you will be able to select different drives from you're computer as shown
below.

The Drive List Box

DirListBox

The DirListBox means the Directory List Box. It is for displaying a list of directories or folders in a selected
drive. When you place this control into the form and run the program, you will be able to select different
directories from a selected drive in your computer as shown below

The DirListBox

FileListBox

You can coordinate the Drive List Box, the Directory List Box and the File List Box to search for the files you
want.

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
 The FileListBox
LESSON 9: Writing Codes

In this lesson, students shall learn some more techniques in writing the Visual Basic program code.

Events

First of all, we should remember that each control or objects in VB are able to run numerous kinds of events.
These events are listed in the dropdown list in the Code Window that is displayed when you double-click on
an object and click on the procedures’ box.

Among the events are loading a form, clicking on a command button, pressing a key on the keyboard or
dragging an object and more. For each event, you need to write an event procedure so that it can perform an
action or a series of actions.

To start writing code for an event procedure, you need to double-click an object to enter the VB code
window.

For example, if you want to write code for the event of clicking a command button, you double-click the
command button and enter the codes in the event procedure that appears in the code window, as shown
below:

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
The structure of an event procedure is as follows:

Private Sub Command1_Click

VB Statements
End Sub

You enter the codes in the space between Private Sub Command1_Click............. End Sub. The
keyword Sub actually stands for a sub procedure that made up a part of all the procedures in a program or a
module. The program code is made up of a number of VB statements that set certain properties or trigger
some actions. The syntax of the Visual Basic’s program code is almost like the normal English language,
though not exactly the same, so it is fairly easy to learn.

The syntax to set the property of an object or to pass a certain value to it is:

[Link]

Where:

Object and Property are separated by a period (or dot).

For example, the statement:

 [Link] means to show the form with the name Form1

 [Link]=true means label1 is set to be visible,
 [Link]=”VB” is to assign the text VB to the text box with the name Text1,
 [Link]=100 is to pass a value of 100 to the text box with the name text2,
 [Link]=False is to disable the timer with the name Timer1 and so on.

EXAMPLE:

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
This program will change the property of the Textbox as the user select a color and font styles at the
corresponding frame group. Open your VB6 application and follow these steps.

STEP 1: Design the user interface as shown below and set its properties

 Controls used and Property Settings (You can refer to LESSON 6 Example 1 How to do it).

Control Property Value

Form1 Name FrmCoding
Caption Exercise 3
BorderStyle 1-Fixed Single
Label1 Caption Date
Label2 Name LblDate
Label3 Caption Your Name
Text1 Name txtYourName
Text NONE
Timer1 Name tmrDate
Interval 100
Frame1 Caption Color
Frame2 Caption Style
Option1 Name optRed
Caption Red
Option2 Name optBlue
Caption Blue
Option3 Name OptGreen
Caption Green
Check1 Name ChkBold
Caption Bold

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
 Check2 Name ChkItalic
Caption Italic
Check3 Name chkUnderline
Caption Underline
Command1 Name cmdReset
Caption &Reset
Command2 Name cmdExit
Caption E&xit

NOTE: The & (Ampersand) symbol will assign a shortcut key to the command button. Keyboard shortcut keys
are keys or combinations of keys that provide an alternate way to do something you'd typically do with a
mouse (e.g. Alt + X for our Exit button typed as E&xit).

After setting the control properties, your Form Design should look like this:

STEP 2: Start Coding:

a. Double-click Option1 and type the following on its procedures:

[Link] = vbRed

b. Select OptBlue on the Object list at the Code Window

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
 Object List

c. Type the following on its procedure:

[Link] = vbBlue

d. Select OptGreen at the Object List at the Code Window and type the following on its procedure as
shown above.

[Link] = vbGreen

Your Code Window should now look something like this:

STEP 3: Complete the Codes

a. Type the following on each control procedures using the methods given at STEP 2:

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
 Private Sub tmrDate_Timer ()
[Link] = Date
End Sub

Private Sub chkBold_Click ()

If [Link] = 1 Then
[Link] = True
Else
[Link] = False
End If
End Sub

Private Sub chkItalic_Click ()

If [Link] = 1 Then
[Link] = True
Else
[Link] = False
End If
End Sub

Private Sub chkUnderline_Click ()

If [Link] = 1 Then
[Link] = True
Else
[Link] = False
End If
End Sub

Private Sub cmdExit_Click ()

End
End Sub

Private Sub cmdReset_Click ()

[Link] = ""
[Link] = vbBlack
End Sub

STEP 4: Start (run) Your Program

a. Press F5 or press the Start icon on the toolbar. Your program interface should look like this:

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
 b. Try to select or deselect any given options (color and style) to test the program logic.

STEP 5: Save Your Work

a. Go to File menu and click Save Project

b. Create a folder and name it Exercise 3 and the project name is Exercise3 (You can refer to LESSON 6,
Example 3, step 4 to step 9 how to do it).

Debugging Your Program

Debugging (Removing program error or bug) is one of the most important skills for a programmer. Software
development is all about writing code, making mistakes, and fixing them. Strong debugging skills minimizes
the development cycle by allowing developers to pinpoint bugs quicker, make fixes that actually address the
problems encountered, and verify the modifications are correct.

A BUG is an error, flaw or fault in a computer program or system that causes it to produce an incorrect or
unexpected result, or to behave in unintended ways.

In this lesson, let’s take a look at one of the most common error VB6 programmer encounters like those you
might encounter while building this Exercise 3 project:

“METHOD OR DATA MEMBER NOT FOUND!” error!

Look at this prompt.

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
 In this case, when you double click the Reset button this will be displayed.

SOLUTION: It happens because there is no Textbox property such as ForeColo. You can correct it by simply
typing the correct property name.

 How about this? Obviously, Label has a property Caption?

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
This usually happens when you COPY and PASTE a control on your Form Design and Click YES when asked
whether or not you want to create a control array. When you did, VB6 assign an index value to the controls.

SOLUTION: To correct this error, select each of the controls you have Copy and Paste and remove all their
index value at the Property Window.

“PROPERTY VALUE OF A CONTROL!” error!

Consider this logic. The Checkbox Bold is already selected at runtime but the textbox property does not
change. To make matter worst, there is NO error prompts whatsoever!

SOLUTION: You can correct this error by going to the Code Window and see how you assigned a value to the
control property in problem (Bold Checkbox). In this case it is:

And there is still more error you might encounter it but for let us skip them for now.

B. ACTIVITY:

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
Directions: Create a program that will produce the following output

A. Follow the procedures at Lesson 9 to be able to complete this project.

C. QUIZ

Directions: Read the questions carefully and choose the right answer. Write the letter of the correct answer
only.

Answer the following questions

1. Its function is to present a list of items where the user can click and select the items from the list.
However, the user needs to click on the small arrowhead on the right of the combo box to see the
items which are presented in a drop-down list.
A. ComboBox
B. CheckBox
C. TextBox
D. Label
2. This control lets the user selects or unselects an option.
A. ComboBox
B. CheckBox
C. TextBox
D. Label

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
3. This is the standard control for accepting input from the user as well as to display the output. It can
handle string (text) and numeric data but not images or pictures.
A. ComboBox
B. CheckBox
C. TextBox
D. Label
4. The ___ is a very useful control for Visual Basic, as it is not only used to provide instructions and
guides to the users, it can also be used to display outputs.
A. ComboBox
B. CheckBox
C. TextBox
D. Label
5. The ___ button is one of the most important controls as it is used to execute commands. It displays
an illusion that the button is pressed when the user clicks on it.
A. Label
B. Command
C. PictureBox
D. Image
6. The ___ Box is one of the controls that is used to handle graphics. You can load a picture at design
phase by clicking on the picture item in the properties window and select the picture from the
selected folder.
A. Label
B. Command
C. PictureBox
D. Image
7. The ___ Control is another control that handles images and pictures. It functions almost identically to
the pictureBox.
A. Image
B. ListBox
C. OptionButton
D. Shape
8. The function of the ___ is to present a list of items where the user can click and select the items from
the list.
A. Image
B. ListBox
C. OptionButton
D. Shape
9. This control also lets the user selects one of the choices. However, two or more Option buttons must
work together because as one of the option buttons is selected, the other Option button will be
unselected.
A. Image
B. ListBox
C. OptionButton

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
 D. Shape
10. To determine the shape of the shape control, we use the shape property. The property
A. Image
B. ListBox
C. OptionButton
D. Shape

III. REFERENCES

Visual Basic Tutorial – Retrieve June 2020:

Controls: [Link]

Write Codes: [Link]

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
ANSWER KEY:

1. Its function is to present a list of items where the user can click and select the items from the list.
However, the user needs to click on the small arrowhead on the right of the combo box to see the
items which are presented in a drop-down list.
a. ComboBox
b. CheckBox
c. TextBox
d. Label
2. This control lets the user selects or unselects an option.
A. ComboBox
B. CheckBox
C. TextBox
D. Label
3. This is the standard control for accepting input from the user as well as to display the output. It can
handle string (text) and numeric data but not images or pictures.
A. ComboBox
B. CheckBox
C. TextBox
D. Label
4. The ___ is a very useful control for Visual Basic, as it is not only used to provide instructions and
guides to the users, it can also be used to display outputs.
A. ComboBox
B. CheckBox
C. TextBox
D. Label
5. The ___ button is one of the most important controls as it is used to execute commands. It displays
an illusion that the button is pressed when the user clicks on it.
A. Label
B. Command
C. PictureBox
D. Image
6. The ___ Box is one of the controls that is used to handle graphics. You can load a picture at design
phase by clicking on the picture item in the properties window and select the picture from the
selected folder.
A. Label
B. Command
C. PictureBox
D. Image

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3
7. The ___ Control is another control that handles images and pictures. It functions almost identically to
the pictureBox.
a. Image
b. ListBox
c. OptionButton
d. Shape
8. The function of the ___ is to present a list of items where the user can click and select the items from
the list.
a. Image
b. ListBox
c. OptionButton
d. Shape
9. This control also lets the user selects one of the choices. However, two or more Option buttons must
work together because as one of the option buttons is selected, the other Option button will be
unselected.
a. Image
b. ListBox
c. OptionButton
d. Shape
10. To determine the shape of the shape control, we use the shape property. The property
a. Image
b. ListBox
c. OptionButton
d. Shape

Developed by: Gateways Institute of Science and Technology

Subject: COMPUTER PROGRAMMING (VB6)
Quarter & Week #: 3rd Quarter – Week 3