Lab 9 – User Forms Design
User Forms
• What are user forms?
– Known as dialog boxes
– Major ways for getting user input
• An example of using user forms: Monthly Sales
Application (Chapter 12, p. 188)
A company has stores in three regions with each region selling
different set of products. This application mainly focuses on
summarizing the sales for a particular product in a particular region
(based on the user’s choices).
Example: Monthly Sales Application
•
An explanation sheet summarizes what an application is about and
how it works. It is good for every application to have such kind of
explanation sheet at the beginning to tell users what it is about
•
The button on this sheet is attached to a macro that runs the
application.
How to Create Your Own User Forms
• Design the user form to have desired functionality and
look attractive (This week)
• Make the designed user form functional: write event
handler code or event code (VBA code) to respond to users’
actions (Next week)
For example, in the previous Monthly Sales application, if a user
clicks on the OK button (this is an event), certain actions should
occur – the users’ inputs should be captured in some way, the
dialog box (or the user form) should disappear, etc. Such actions
should be fulfilled through code (event code).
Designing User Forms
• Major things you need to know:
–
–
–
–
What are controls – Objects with certain properties and methods
Which controls (also called ActiveX controls) are available
How to place, resize, and line up controls on a user form
How to specify or change controls’ properties in the Properties
window (in VBE)
To Start …
• First, open a new workbook in EXCEL, get into the VBE,
and make sure you can see Project Explorer and Property
windows (Go to View menu item to open them)
• Select the current project, then use Insert\ UserForm to
create a blank user form.
Available Controls
• The available controls are those shown in the Toolbox. The
arrow at the top left is used only for pointing
• Each of the rest , starting with the letter “A”, has a name
(from the left to right, top to bottom):
First row: Label, Textbox, ComboBox, ListBox
Second row: CheckBox, OptionButton,
ToggleButton, Frame, CommandButton
Third row: TabStrip, MultiPage, ScrollBar,
SpinButton, Image
Fourth row: RefEdit (highlight a worksheet range)
Introduction to Major Controls
• CommandButton – used to run subs (the user clicks on a button and a
sub runs)
• Label – used mainly for explanation and prompts
• TextBox – used to obtain any type of user input (the user types
something in the box)
• ListBox – used to let the user choose one or more items from a list
• ComboBox – similar to a list box, except that the user can type an item
that isn’t on the list in a box
• CheckBox – used to let the user check whether an option is desired or
not (any or all of a set of check boxes can be checked)
• OptionButton – used to let the user check which of several options is
desired (only one of a set of option buttons can be checked)
• Frame – usually used to group a related set of options buttons, but can
be used to organize any set of controls into logical groups
Note: if you need description about other controls, you can check them
in the MSForms library in VBE Object Browser
Exercise - Design a User Form
• In the following, we will
design a user form in
order to understand how to
place, resize, and line up
controls on a user form
and how to specify or
change controls’
properties in the
Properties window
• The resulting user form
should look similar to the
figure on the right.
Exercise Step 1: Adding Controls to a User
Form
• First, enlarge the user form
• Click on a control in the Toolbox and then drag and shape
it on the form
• After you add a number of controls, you can select a group
of controls (by dragging the mouse over them) and right
click on them (or use the Format menu item) to align and
resize the controls
• Step 1.1: Add an explanation label on the top of the user
form
• Step 1.2: Add two command buttons at the top right
(“Submit” and “Cancel”) - Press the Ctrl key for copying
Exercise Step 1: Adding Controls to a User
Form
• Step 1.3: Add 2 text boxes and their corresponding labels
(which act as prompts for what the user should enter in the
box.)
• Step 1.4: Add a frame and then add 2 option buttons within
it
• Step 1.5: Copy the frame to its right and add 2 more option
buttons within the group
• Step 1.6: Add another frame at the bottom and 4 Check
boxes within it
• Step 1.7: Add a list box to the right of the frame and its
corresponding label
• Step 1.8: resize and align the controls to make them look
nicer
Now time to make changes to the properties of these
control objects …
Control Properties
• Major properties of user forms and controls
– Name property
• Assigns a name to an object
• Used by the programmer to refer to an object in VBA code
• A name can contain letters, numbers, and the underscore
character only, must begin with a letter, and must not exceed 40
characters
– Caption property
• Controls what the user sees on screen
• Usually, you need to change the Name and Caption properties of user
forms and some controls. As to other properties of different objects,
whether to change them or not depends on the type of object, the
application, and the developer’s preferences.
• To set properties of a control, you need to select the control first, then
the Properties window will show the properties for this control.
• Now, let’s go back to the exercise …
Exercise Step 2: Setting Properties of the Controls
• Change the user form Name property to “InputsForm” and
its Caption property as “Student Record”
• Top command button: change its Name property to
SubmitButton, change its Caption Property to Submit, and
change its Default property to True – this gives the Submit
button the functionality you expect once the form is
operational, so that you can click on it or press the Enter
key to do the same thing
• Bottom command button: change its Name property to
CancelButton, change its Caption Property to Cancel, and
change its Cancel Property to True – to allow a user to
press the Esc key instead of clicking on the Cancel button
• Top label: click on the label and change the Caption
Property (“This user form is for test purpose only.”)
Exercise Step 2: Setting Properties of the Controls
• Label2 & Label3: Change the Caption property to Name
and GPA respectively
• Text boxes: change the Name property to NameBox and
GPABox
• Frames: change Caption property to “Gender”,
“Standings”, and “Hobby” respectively, and rename their
Name property as “GenderFrame”, etc.
• Within the Gender frame:
Option buttons: Change the Name properties of the option
buttons into MaleOption and FemaleOption, and change
their captions to Male and Female.
• Similarly, within the Standings frame, change Name and
Caption properties of the other four option buttons into
FreshmanOption, SophomoreOption, Freshman,
Sophomore, etc.
Exercise Step 2: Setting Properties of the Controls
• Check boxes: Change the Name and Caption properties to SportsBox
and Sports, MovieBox and Movie, etc
• List Box: change its Name property to CourseList. It does not have a
Caption property, so add a label above it called “Courses Taken”
MultiSelect property:
– Default: 0-fmMultiSelectSingle (only one items could be selected)
– 2-fmMultiSelectExtended (more then one items could be selected)
– Choose this one in this exercise
• Tab Order
– To allow users to tab from one control to another by pressing the
Tab key - change the TabIndex property of each control, starting
with index 0
• Any control with the TabStop property set to False cannot be
tabbed to (e.g., Labels)
• For frames and its inside option buttons, tabs are set separately
(also starting with index 0)
Exercise: Test the User Form
• Select the user form
• Run Sub/UserForm – Tab through the controls too
• Note that you can’t do anything further because
the controls are not functional yet.
• Usually, when a dialog box pops up, it contains
some default settings. To do this, we can initialize
our user form.
• To be Continued…