Understanding concepts in VB

The user interface is the link between the user and the application. The usability of
the application depends on the interface. While creating an application in VB,
the form is the basic element of the user interface. Controls are then added to
provide specific functionality. Both these objects can be modified by the
programmer by changing their properties, methods and events.
Designing the interface

To Draw a Control on a form

To remove a control from the form

To move / resize a control

Aligning controls

Container control / child control

Naming Controls

• The names of controls and forms must satisfy the following criteria:
• It must begin with a letter.
• must contain only letters, numbers and underscore character( _ ).
• Punctuation characters and spaces are not allowed.
• must not be longer than 40 characters.
Which of the following are valid object names:
Name Valid / Invalid
Lbx12 Valid
@Rs Invalid
_lb1 Invalid
123_label Invalid
?1 Invalid
Star1 Valid
%age Invalid
We can use a prefix to describe a class, followed by a descriptive name
for the control. Using this naming convention makes the code more
self-descriptive and alphabetically groups similar objects in the
object list box.

E.g. we can name a checkbox control as ChkReadOnly

Control Prefix
Label Lbl
Frame Fra

Chekbox chk

Combobox Cbo
Hscrollbar Hsb
Timer Tmr
DirListBox Dir
Shape Shp
Control Prefix
Image Img

Line Lin

PictureBox Pic
TextBox Txt

CommandButton Cmd

OptionButton Opt

ListBox Lst
Properties
Properties are the object attributes. The controls / objects that we draw
on a form, have some properties associated with them. After a
control is added to a form, the programmer can set the
characteristics of the controls and the form such as size color, screen
location or the state of the control, such as enabled or disabled.
A few common properties are :
– Name
– Appearance
– Backcolor
– Forecolor
– Font
– Caption
– Width
– Height
– Left
– Top
– Enabled
– Visible
Working with Forms

In VB, the Form acts as the container for all the controls that make up
the interface. The form is the top-level object in a VB application,
and every application starts with the Form.
Characteristics of a form:

 Title bar: on which the form’s caption is displayed.

 Control menu: On left end of the title bar is the control menu icon.
Clicking this icon opens the control menu. The control menu contains the
following commands:

1. Restore
2. Move
3. Size
4. Minimize
5. Maximize
6. Close
On the right side of the title bars are the three buttons:
1. Minimize
2. maximize
3. close buttons

Clicking these buttons perform the associated function.

Customizing form properties:

Property Description

MinButton Specifies whether a minimize window button appears on the

form.
MaxButton Specifies whether a maximize window button appears on the
form.
Controlbox This property displays the control menu, if it is set to true. By
default it is true. We can set it to false to hide the control menu
icon and disable the control menu.
When the controlbox property is set to false the three buttons
(Minimize, Maximize and close) on the title bar also gets
disabled.
Property Description

Borderstyle This property determines the border’s style for a Form and
also its appearance. It can take any of the following values:
Value Description
0-None No border for form. Form
cannot be resized. This
setting should be avoided.

1-Fixed Single Visible border. Form cannot be

resized.
2- Sizeable Visible border. Form can be
moved and resized.
Property Description

Value Description
3- Fixed dialog For fixed dialog boxes

4- Fixed tool window Form has a closed button

only; can’t be sized.

5- Sizeable Tool Window Same as the fixed tool /

window, but the Form can
be resized.
Property Description

Backcolor Specifies the form’s background color.

Enabled Determines whether the form is active.

Font Produces a font dialog box in which we can set the text’s
font name, style and size
Icon Describes the icon graphic image displayed on the taskbar
when the user minimizes the form
Moveable Specifies whether the user can move the form at runtime.

Picture Determines the graphic image that appears on the form’s

background at runtime.
Setting the startup form

An application generally has more than one form. When an application

starts, the main form that gets loaded first of all is called Startup
form.

By default, the first form in the application is designated as the start up

form. If we want a different form to display when the application
starts, we must change the startup form.
To change the startup form

1. From the project menu, choose Project properties.

2. Choose general tab
3. In start up object list box, select the form we want as the new
startup form.
4. Choose OK.
Loading ,Showing and Hiding forms
A form can be in one of the following states:

(i) Not loaded : Form lives on the disk file and doesn’t take up any
resources ( such as memory etc.)
(ii) Loaded and hidden: Form is loaded into memory and is ready to
be displayed.
(iii) Loaded and shown : Form is shown and the user can interact with
it.
State of a form can be changed by using Load, Unload, show and
Hide methods.

Loading ,Unloading forms

Load <formname>

Unload <formname>
The load method does not display the form on the desktop, it just loads
the form in the memory.

The unload method removes a form from the memory and the
resources occupied by it are released so that they can be used by
other applications
Showing Forms

Syntax

< formname>.show [<mode>]

The <mode> argument can take one of the following values:

0 – Modeless (Default) allows the user to switch to any

other form of the application

1 – Modal A modal form takes control of

the application and does not let
the user work with other parts
of the application unless this form
is closed.
Note : The Show method also loads the form if it is not loaded
already.

Hiding forms

<formname>.hide
A hidden form remains in memory and can be displayed instantly with
show method.
Label Control

A label control displays text that user cannot directly change. The actual text
displayed in a label is controlled by its caption property.
Major Properties of Label control are:

 1. Caption - the propery used to display text in the label control

 2. Font – the property used to specify the display font, style and size for the
caption of the label

 3. BackColor and ForeColor - colors of the background and the text

 4. BackStyle - Opaque or Transparent - whether the background is visible
or not

 5. Name – the property used to name the label control.

 6. Alignment – specifies the alignment of label’s caption. Alignment can

be left justified, right justified or centered.
 7. Wordwrap – this property is used to set the word wrapping option for
the caption text. By default, if the text exceeds the width of the label, the
text wraps to the next line. If the text goes beyond the height of label, then
it is clipped. If we set this property to True then the text is wrapped and
expanded vertically.

 8. Autosize – this property causes the control to horizontally expand and

adjust to the size of its contents

 9. Borderstyle- this property, if set to 1, the label appears with a border.

Textbox Control

Textboxes are versatile controls that can be used to get input from the
user or to display text.

Major properties of a textbox control are:

1. Name: property to specify name

2. Text : property to specify text to be displayed in the textbox. This

text can be accessed as well as edited.

3. Font – the property used to specify the display font, style and size for the
caption of the label
4. Maxlength: property used to set the maximum number of characters
allowed in the textbox

Note : The amount of text that can be placed in a multiline Textbox control is
limited approximately to 32 KB. A single line textbox can hold only 255
characters.

5. Enabled : this property is used to set a value that determines if the text box
can respond to the events that are generated by the user

6. Multiline: this property, allows multiple lines of text in the text box.

7. Scrollbar: this property allows us to attach a built in scrollbar to the

textbox, so that the user can scroll text in the textbox, when the program is
running.
8. PasswordCharacter: This property is important if we plan to read a
password through textbox. If we specify a character in this property,
then in place of the text being entered, these characters are
displayed.

9. Seltext: property that returns the selected text.

10. Selstart: property that returns or sets the position of the first
character of the selected text.

11. SelLength: property that returns the length of the selected text.
Command button

The CommandButton is used to make an action happen e.g. process the

inputs that have been entered onto a Form and then show the output.

Properties

Caption

This property holds the text that appears on the command button
BackColor

Sets the colour of the CommandButton's background.  This property

only takes effect when the Style property is set to 1 - Graphical.

Cancel

If this property is set to True, pressing the Escape key at runtime will
activate the CommandButton's Click event.  Only one
CommandButton on the Form can have this property set to True.
Default
This property determines if the command button responds to an Enter
keypress even if another control has the focus.  The
CommandButton, which has this property set to True, will also
appear with a darker border.

Enabled
When this property is set to False, the user is not able to interact with
the CommandButton in any way e.g. it cannot be clicked on or have
focus.  The caption will appear greyed out.
Font

In design time, this brings up the Font dialog box to allow us to choose
the font name, style, size and whether the Strikeout and Underline
attributes are set. 

Height
Sets the height of the CommandButton.

Left
Sets the X coordinate of the CommandButton.
Top
Sets the Y coordinate of the CommandButton.

Visible
Determines whether the CommandButton appears on the Form.  I.e. if
set to False, the CommandButton will be unavailable to the user -
even by trying to set focus to it with the tab key.

Width
Sets the width of the CommandButton.
Picture
Sets the picture, which is displayed in the background of the
CommandButton. The Style property needs to be set to 1 - Graphical
for this property to work.

Style
This needs to be set to 1 - Graphical if you want to use the graphical
properties of the CommandButton (apart from Fonts).
TabIndex
Sets the order in which the controls will get focus when the tab key is
pressed.  The control that has 0 as its TabIndex will have focus when
the Form is loaded.

TabStop
If you set this to False, the CommandButton will not get focus when the
tab key is pressed.

Tag
This property can be set to a string if you need to store any extra
information related to the CommandButton.
ToolTipText
When this property is set, the text will popup over the CommandButton
when the user hovers the mouse pointer over it.  This can be useful if
we cannot fit all the text you need to in the Caption.
Assigning access keys

To assign a keyboard access key to a command button, we need to place

an ampersand (&) in front of the letter that is to be used as access
key, while setting the caption property of command button.

For example, if we want to assign Alt + P as the access key for a print
command button, we can set the caption property to &Print. VB
shows this key by underlining it i.e. this caption appears as Print.
Frame control

A frame control is used to group various controls. A frame control is a

container control , i.e. it contains other controls in it. It does not
carry out any job / action by itself , it does not respond to any events
by itself.
Major properties of frame control

Caption
Property to display text in the frame control

Font
Property to set font, style, and size of captioned text of frame

(Name)
property to name the frame
Visible
Property used to set a value indicating whether the frame should be visible
( value – True) or not (value – false)

Borderstyle
Property used to specify the style of border.
0- None
1- Fixed single

Appearance
Property used to set look of the frame
0 – Flat
1- 3D
OptionButton Control (Radio Button)

The option buttons are used to offer a small set of options from which a
user can choose one.

Option buttons should always work as part of a group; selecting one

option button immediately clears all the other buttons in the
group.
Option button groups operate in a container control, such as a frame.
Therefore, different sets of option button groups should be placed in
their own frame on the form.
Major properties of option button control are :

Caption
Property to display text for option button

Name
Property to name the option button

Value
Property to set the state of option button. If set to True, the option
button appears selected.
Alignment
Property to set the alignment of the option button.
0- Left justify – option button appears on the left of caption

1-Right justify – option button appears on the right of the

caption.

Style
This property is used to set the appearance style which can either be 0-
standard (default) or 1- graphical ( it makes option button appear as a
command button.
Enabled
Property used to set a value that determines whether a checkbox can
respond to user-generated events
Checkbox control

The checkbox controls are used for offering a small set of choices from
which a user can choose one or more options.

A check box indicates whether a particular condition is on or off.

Checkboxes work independently of each other, a user can select
any number of checkboxes at the same time.
Major properties of checkbox control are :

Caption
Property the specify text to be displayed.

Name
Property to specify name

Alignment
Property to set the alignment of the checkbox.
0- Left justify – checkbox appears on the left of caption

1-Right justify – checkbox appears on the right of the

caption.
Enabled
Property used to set a value that determines whether a checkbox can
respond to user-generated events

Value
Property used to specify the state of checkbox. If its value is :

0 or Unchecked , it means the checkbox is unchecked

1 or Vbchecked it means the checkbox is checked
2 or Vbgrayed it means the checkbox is disabled
.
ListBox Control

The listbox control presents a list of choices to the user. The choices
are presented in one or more columns. If the number of items
exceeds what can be displayed in a list box, scrollbars automatically
appear on the control.
Major properties of listbox control are :

Multiselect : This property determines whether the user can select the list’s
multiple items or not. This property must be set at design time. At runtime
we can’t change this property, we can only read its value.

It can take following values:

0 multiple selection not allowed, default setting

1 Simple multiple selection (mouse click, pressing space bar)
2 Extended multiple selection (Shift key + mouse click/ Ctrl + mouse click)
Sorted this property determines whether the items in the list
is sorted or not.
( Value – True / False)

Style 0 Standard appearance

1 Checkbox appearance

Listindex Gives the index of selected item in the list. I f

multiple items are selected, then listindex
property stores the index of most recently
selected items.
Newindex this property returns the index of the item most
recently added to the listbox
Adding items to list at runtime

Syntax

<Listname>.Additem <item> ,<index>

Deleting items from the list

Syntax

<Listname>.Removeitem <index>
Clearing the List

<listname>.Clear

Accessing items in the list

<Listname>.list(<index>)

Counting the number of items in list

<listname>.listcount
Combo Box

• It combines the features of a listbox and a textbox.

• Combo box is similar to a listbox control – it contains multiple items

of which the user may select one, but it takes less space on screen.

• It is an expandable listbox control, which can grow when the user

wants to make a selection and retract after the selection is made.
Combo box control allows the user to specify items that don’t exist in
the list.

Three types of combobox controls are available:

Value Description

0 default ( Drop down combo)

1 Simple combo ( list doesn’t drop down)
2 Drop down list ( doesn’t allow user to
enter a new item)
Hscrollbar and Vscrollbar controls

A scrollbar is a long stripe with an indicator that lets the user select a value
between the two ends of a control.
The scrollbar comes in two forms :

a) Horizontal scrollbar – HScrollbar

b) Vertical Scrollbar – VScrollbar

The only difference between the two is their orientation. The left end ( in a
horizontal scroll bar) and the top end ( in a vertical scroll bar) corresponds
to its minimum value and the other end corresponds to its maximum value.
The current value of the scrollbar control is determined by the position
of the indicator ( or scrollbox) which is scrolled between the
minimum and the maximum values.

The basic properties are:

Min this property returns the scrollbar’s minimum

value

Max this property returns the scrollbar’s maximum

value
value this property returns the current value of
scrollbar

Largechange specifies the change in value if user clicks on

the scrollbar in an area other than the indicator and
the arrow keys

Smallchange specifies the change in value if the user clicks at

the arrow keys of the scrollbar.
The scroll bar controls use the Scroll and Change events to monitor
the movement of the scroll box along the scroll bar.

Event Description

Change occurs after the scroll box is moved

Scroll occurs as the scroll box is moved. Does

not occur if the scroll arrows or scrollbar
Image Control

Image control is used to display graphics. Image control can display

graphics in the following formats: bitmaps (BMP), device
independent bitmaps (DIB), metafiles (WMF), enhanced metafiles
(EMF), GIF and JPEG files, and icons (ICO) and cursor( CUR)
files.

Image controls can be used as a substitute for command buttons as

items in a toolbar.
Some properties of image control

Appearance 0 – Flat
1 – 3D . We can view the result of this property
if we set a border to the image control.

Borderstyle 0 – None
1 – Fixed Single

Picture this property determines which picture is

displayed in the image box.
Stretch this property determines whether the image is
resized if the size of the imagebox control is different from
the picture loaded into it.

True: image is resized to fill the area of

imagebox control.

false: Imagebox control behaves like a picture

box control with Autosize property set to true.
Loading graphics into Imagebox Control

Pictures can be loaded into the imagebox control at design time by

selecting the Picture property.
If we want to load or change image at runtime, we can do this by using
the picture property and the Loadpicture function.

E.g.

Image1.Picture= Loadpicture(“c:\images\fountain.gif”)
To clear the graphics from the image control, we set the picture
property to Nothing;

Image1.Picture= Nothing

Or use the loadpicture function without specifying the file name:

Image1.Picture=Loadpicture
Picturebox control

The picture control is used to display graphics, to act as container for

other controls and display output from graphics methods or text
using the print statement.

Picturebox control is similar to the image control in that each can be

used to display graphics in the application and each supports the
same file formats. The picture box control , contains additional
functionality which the image control does not for example the
ability to act as a container for other controls and support for
graphics methods.
Picture box control can display graphics in the following formats:
bitmaps (BMP), device independent bitmaps (DIB), metafiles
(WMF), enhanced metafiles (EMF), GIF and JPEG files, and icons
(ICO) and cursor( CUR) files.
Some properties of picture box control

Appearance 0 – Flat
1 – 3D . We can view the result of this property
if we set a border to the picture box
control.

Borderstyle 0 – None
1 – Fixed Single

Picture this property determines which picture is

displayed in the picture box.
Autosize this property determines whether picture box is
automatically resized to display its image
entirely.

True Control is resized to the dimensions of

the image it conatins.

False Only the part of the image that can fit in

the control is displayed
Loading graphics into Picture box Control

Pictures can be loaded into the picture box control at design time by
selecting the Picture property.
If we want to load or change picture at runtime, we can do this by
using the picture property and the Loadpicture function.

E.g.

picture 1.Picture= Loadpicture(“c:\images\fountain.gif”)

To clear the graphics from the picture control, we set the picture
property to Nothing;

picture 1.Picture= Nothing

Or use the loadpicture function without specifying the file name:

picture 1.Picture=Loadpicture
Difference between Image box control and picture box control

Image box control is used only to display graphics.

Picture box control can be used to display graphics and can also be used as a
container control. It also provides support for graphics properties and
methods. Picture Box controls support all the properties related to graphic
output, including AutoRedraw, ClipControls, HasDC, FontTransparent,
CurrentX, CurrentY, and all the Drawxxxx, Fillxxxx, and Scalexxxx
properties. PictureBox controls also support all graphic methods, such as
Cls, PSet, Point, Line, and Circle and conversion methods, such as ScaleX,
ScaleY, TextWidth, and TextHeight.
The sizing behavior of the image control differs from that of picture box
control. It has the Stretch property while the picture box has as
Autosize property.
Stretch property of Image box
this property determines whether the image is resized if the size of the
imagebox control is different from the picture loaded into it.

True: image is resized to fill the area of imagebox control.

false: Imagebox control behaves like a picture box control with

Autosize property set to true.
Autosize Property of picture box

this property determines whether picture box is automatically resized to

display its image entirely.

True Control is resized to the dimensions of the image it conatins.

False Only the part of the image that can fit in the control is displayed
The image box control is good for displaying graphics and uses fewer
resources than picturebox controls. The picture box control provides
methods for drawing at runtime and is much more flexible than
image box control.
Timer Control

The Timer control allows you to perform a task at a specified interval

or to wait for a specified length of time.

Following are the facts about Timer control:

• It is not visible to the user at run-time

• The actions that you want to happen at the specified interval are
coded in the Timer's Timer event.
• We specify the interval at which we want actions to occur, in the
Timer control's Interval property. The value is specified in
milliseconds (1000 milliseconds = 1 second). The timer control
triggers a timer event after each interval of time goes by.

The interval property contains a value that must range from 1to 65535.
• We turn the timer "on" or "off" by setting its Enabled property to
True or False, respectively. The Enabled property is set to True by
default. Also setting the interval property to 0 disables the timer
control.
 
Program for Blinking text

The Timer control can be used to make an object on your screen appear
to blink. This is done by toggling the Visible property of the object
on and off at short intervals. The Visible property is available to
nearly all controls. It is a Boolean property that determines whether
or not the control is visible to the user at run time by setting its value
to True or False To build a simple demo, perform the following
steps.
 
Start a new VB project.
Place a label on the form and name it lblProcess. Set its Caption to
Processing . . ..
Set it to a large font and set its Forecolor property to the color of your
choice. Center it on your form.
Place a timer on the form and name it tmrBlink. Set its Interval
property to 250.
In the tmrBlink_Timer event, place the following single line of code:
 
lblProcess.Visible = Not lblProcess.Visible
 
Run the project. The label will blink