Visual Basic: Forms, Controls
and Events
Topics
• Forms
• Form properties
• Controls
• Control properties
• Event Driven Programming
• Form Events
• Control Events
• Event Handlers
• VB Example Program
Forms
• A form is a container for controls
• A form is used to design a GUI-based window
in a Windows application
• A form displays information and receives
input from the user.
• Always orient a form at a task as defined by
the user
Form Properties
• Text – defines the text to display in the caption bar
• StartPosition – determines position of form when it
first appears (eg. CenterScreen)
• Size.Width, Size.Height – the 2D area occupied by
the form, in units of pixels
• Location.X, Location.Y – the relative position of the
form on the screen
• Visible – can be seen by the user
• Enabled – the user can interact with the form
Form Properties (cont.)
• FormBorderStyle – determines the appearance and
behavior of the borders of the form
– Sizable: (Default) Has min, max, and close buttons; can be
resized by dragging edges
– Fixed3D: Has a 3D look; min, max, and close buttons; cannot be
resized
– FixedSingle: Has single line border; min, max, and close buttons;
cannot be resized
• AcceptButton - designates which button on the form is
activated by the Enter Key
• Cancel Button - designates which button on the form is
activated by the ESC Key
Controls
• Visual objects that are placed on a form to enable
customized activities
• Familiar Visual Basic controls:
– Label - displays text the user cannot change
– TextBox - allows the user to enter text
– Button – performs an action when clicked
– RadioButton - A round button that is selected or deselected with a mouse
– CheckBox – A box that is checked or unchecked with a mouse click
– Form - A window that contains these controls
• Built-in controls defined in Windows Form class library,
and are defined
– with ToolBox and Form Designer
– or strictly with code
Types of Controls w/Prefixes
• Text edit (TextBox—txt___)
• Text display (Label—default name or lbl___)
• Selection from a list (ListBox—lst___, ComboBox—cbo___,
ListView, TreeView, NumericUpDown…)
• Graphic display (PictureBox—pic___)
• Graphic storage (ImageList)
• Value setting (CheckBox—chk___, CheckListBox, RadioButton,…)
• Date setting (DateTimePicker, MonthCalendar)
• Dialog boxes (OpenFileDialog, PrintDialog…)
• Menu controls (MainMenu, …)
• Commands (Button—btn___, LinkLabel…)
• Grouping other controls (GroupBox, TabControl, Panel)
Control Properties - Common
• Common properties shared by many controls
– Name, Text
– Size.Height & Width, Location.X &Y, Dock
– BackColor: Sets the background (fill) color
– ForeColor: Sets the foreground (text) color
– CanFocus, ContainsFocus, Focused
– Visible & Enabled determine availability to user
– Font properties affect text display in the control
• Font, size, bold, etc.
– Tab Index & Tab Stop
Setting Properties
• Design Time Set in
Properties Window
• Run Time Set / Change in
Code
Syntax for Referring to the
Value of a Control's Property
• Specify the control name (btnExit)
• Then a dot
• Then the PropertyName (Visible)
• controlName.propertyName
– btnExit.Visible
• refers to the Visible property of the btnExit control
• The visible property values may only be true or false
Slide 2- 10
Assignment Statement – Set/ Change the
Value of a Control Property
• Item to receive the value (Left Side)
• Assignment Indicator =
• Value to be assigned(Right Side)
• VariableName = Value
– NumberVariable = 5
• ControlName.PropertyName = Setting
– btnExit.Visible = False
• Assigns the value False to the Visible property of the btnExit control
• Causes the text of the btnExit control to become hidden to the user
– txtFirstName.text = “Paul”
– txtLastName.text = “Overstreet”
Buttons
• Properties
– Text
• &Cancel -> Cancel
• && -> &
• Events
– Click
Labels and LinkLabels
• Use labels and link labels for text
display
– Text property (no more Caption) defines
text to display
– User cannot change a label
• LinkLabel enables hyperlinks
– Links.Add inserts a hyperlink into text
– Must write event-handler to invoke
browser
– See example
Text Boxes: Text Input, Edit, and
Display
• Text box allows user to
enter or edit data
• Properties
– MaxLength, MultiLine
– AcceptsTab
– AcceptsReturn
– WordWrap
– ScrollBars
• Events
– TextChanged
CheckBox Control
• CheckState property
– Checked
– Unchecked
– Indeterminate (checked
but grayed)
• Text property displays
built-in caption
If chkMarried.CheckState = CheckState.Checked Then
End If
List Selection Controls
• ComboBox Properties
– Text
– DropDownStyle
• Simple
• Dropdown
cboChoice.Items.Clear()
• DropdownList cboChoice.Items.Add("First")
– Sorted cboChoice.Items.Add("Second")
cboChoice.Items.Add("Third")
• Methods cboChoice.Items.Add(TextBox1.Text)
– Items.Clear
– Items.Add
– Items.Remove
cboChoice.Items.Remove("Third")
Timer Control
• Executes code after a specified
interval
• Timer Event
– Unique event that executes
after the interval specified in the
interval property expires
• Interval Property
– 0 - 65,535 milliseconds
• 0 - means disabled
• 60,000 milliseconds is one
minute
• Enabled property must also be
true for timer to work.
• Timer control is never visible at
run time
• Stored in Component Tray at
design time
Event Driven Programming
• Applications recognize and respond to events by
executing code known as event procedures
• Event: An action that is recognized by an object.
– User Actions
• Mouse Click
• Entering Text
• Pressing a Key
– Program Calculations
– Triggered by the system
• Timer
• Event Handler: Code that is written by the
programmer to respond to an event
– Executes only when particular event occurs
Form Events
• Common Form Events
– Form1_Load() - Occurs before a form is displayed
for the first time.
– Form1_Activated() - Occurs when form becomes
the active window - through code or by user
– Form1_Deactivate() - Occurs when the form loses
focus and is not the active form
– Form1_Closing() - Occurs when the form closes,
either through an event or the windows close
button being clicked
Control Events
• Many controls share a Common set of events to
which they can react
– Click, DoubleClick
– MouseMove, MouseDown, MouseUp, MouseWheel,
MouseHover, MouseLeave
– KeyPress, KeyDown, KeyUp
– Resize
– DragDrop
– GotFocus
– LostFocus
Focus and Validation Event Sequence
Focus is when an object becomes the “Active
Control”
Focus Event Sequence:
Enter
GotFocus
Leave
Validating
Validated
LostFocus
Coding Event Handlers
• Create Event Procedure
– Double Click on Control
– Displays Code Window and Event Procedure Stub for
default event
Or
– Open the Code Editor (F7 or View Menu:Code Command)
– Select Control & Event from drop down windows in Code
Editor
Event Code Goes In Here
Event Handler Example
Exit Button – Clicked Method (btnExit_Click)
Marks the beginning of this event procedure
Name of the control that owns the event procedure
Name of the event the procedure responds to
Line Continuation Mark
Private Sub btnExit_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles btnExit.Click
' End the application
End
End Sub
Event handled by this procedure
Ends the program
Event Driven Programming
Components
• Input
– Controls
• Process
– Events
• Output
– Controls
Event Driven Programming
Implementation Phase Steps
Implement the solution in VB:
• Create the Interface
– Input Controls
– Output Controls
• Set the Properties
– Configure the appearance and behavior of the
controls
• Write the Code to execute when events occur
– Process the inputs to create the outputs
VB Example: The Interface
• Using Visual Basic.Net create
the following form
Object Property Setting
Form1 Text Demonstration
txtFirst Text (blank)
txtSecond Text (blank)
btnRed Text Change Color
to Red
VB Example: Button Click Event
Procedure
When btnRed is clicked - Change txtFirst text color to red
• Double Click on btnRed
• Code window should appear
(with Event Procedure Stub)
• Add code to the event procedure stub:
txtFirst.ForeColor = Color.Red
VB Example: Textbox Text Changed
Event Procedure
When the text is edited in txtFirst - Change txtFirst text color to blue
•In Code Window
•Select the Control for the Event Procedure
– txtFirst from the ClassName box
•Select the Event from the Method Name Box
– TextChanged
C
M
et
las ho
sN d
Na
am m
e e
Bo Bo
x x
VB Example: Textbox Text Changed
Event Procedure (cont.)
• Add code to the event procedure stub:
– txtFirst.ForeColor = Color.Blue
VB Example: Textbox Leave Event
Procedure
When txtFirst is deselected - Change txtFirst text color to black
•In Code Window
•Select the Control for the Event Procedure
– txtFirst from the ClassName box
•Select the Event from the Method Name Box
– Leave
•Add code to the event procedure stub:
– txtFirst.ForeColor = Color.Black
VB Example: Run the Program
• Click F5 or the Run Button
• Type “Hello” into the 1st textbox
– What Happens
• Click on the 2nd Textbox
– What happened in txtFirst and Why
• Click on the Button
– What happened in txtFirst
• Type “Friends” into the 1st textbox
• Stop Program by clicking Red X in corner
VB Example: Exit Button Clicked Event
Procedure
• Add a Button to your Form
– Name: btnExit
– Text Property: &Quit
• Add a Button Click Event for this Button
– Code: END
VB Example: Code Editor
• Finds Syntax Errors (Errors in Programming Language)
• Return to btnRed Click Event Procedure
• Add this line of Code:
– txtSecond.text = Hello
Notice Wavy Blue Line – This indicates a Syntax Error that must be fixed.
VB Example: Run the Program Again
• Test All Events
• Click Quit Button
