Event-driven
Programming
Lesson 1
1
2
Learning Objectives
1. Describe Event-Driven Programming
2. Define Visual Basic ( VB )
3. Identify Benefits of using Visual Basic
4. History of Visual Basic
5. Describe the process of visual program design and development.
6. List and describe the three steps for writing a Visual Basic project.
7. Describe the various files that make up a Visual Basic project &
identify the elements in the Visual Studio environment.
8. Design a user interface by following the instructions in the given
problems.
3
Event-Driven Programming
currently the default paradigm in software engineering.
it uses events as the basis for developing the software.
These events can be something the users are doing
clicking on a specific button
picking an option from drop-down
typing text into a field,
giving voice commands,
or uploading a video
or system-generated events such as a program loading.
4
Event-driven Programming
is designed to react.
5
Why Is It So Popular Right Now?
Event-driven programming serves the user with
the quickest and most accurate responses and this
usually translates into better user experience and
business gains.
the whole focus of software development is on the
actual people using the app and their actions, so it
will produce better and more intuitive products for
the end-users.
6
Why Is It So Popular Right Now?
The opposite of event-driven programming would be software that
doesn’t need any user input to act.
There are definitely valid use cases for this as well but the majority of
popular applications on the market right now function through user
input (all the social media platforms, games, productivity tools, etc).
GUI (graphical user interface) applications can experience the
biggest benefits of using this approach.
One of the big benefits of event-driven programming is that it’s
very intuitive, flexible and naturally well-suited to applications whose
control flow are based, not on its structure, but rather on internal or
external events.
7
What’s the Best Programming
Language for This Approach?
Because event-driven programming is an approach
rather than a type of programming language, it can
be practiced with any programming language.
8
What Are the Disadvantages?
Since it offers the most value for GUI applications,
some other use cases might not benefit from it.
complex to master and not worth the trouble when
your application is very simple and small.
9
What’s the Next Big Thing?
The next big paradigm shift definitely comes with serverless
computing — it’s another level of abstraction that makes creating
new applications easier and quicker.
With serverless, you don’t have to worry about server ops anymore;
you can just write your functions,
upload the code to one of the cloud providers (AWS Lambda is
currently the biggest one) and let them handle all the backend work
(and you only pay for the time when your code is executed).
This is the next big change that will bring event-based programming
to the next level and it’s already gaining mainstream traction.
10
Event-driven programming
isa programming paradigm in which the flow of program
execution is determined by events
for example a user action such as a mouse click, key press, or a
message from the operating system or another program.
An event-driven application is designed to detect events as
they occur, and then deal with them using an appropriate
event-handling procedure.
The idea is an extension of interrupt-driven programming of
the kind found in early command-line environments such as
DOS, and in embedded systems (where the application is
implemented as firmware).
11
Event-driven programs
can be written in any programming language, although some
languages(Visual Basic for example) are specifically designed
to facilitate event-driven programming, and provide an
integrated development environment (IDE) that partially
automates the production of code, and provides a
comprehensive selection of built-in objects and controls, each
of which can respond to a range of events.
Virtually all object-oriented and visual languages support
event-driven programming.
Visual Basic, Visual C++ and Java are examples of such
languages.
12
A visual programming IDE
such as VB.Net provides much of the code for detecting events
automatically when a new application is created.
The programmer can therefore concentrate on issues such as
interface design, which involves adding controls such as
command buttons,
text boxes, and
labels to standard forms (a form represents an application's
workspace or window).
Once the user interface is substantially complete, the
programmer can add event-handling code to each control as
required.
13
Visual programming environments
will even provide code templates for event-handlers, so
the programmer only needs to provide the code that
defines the action the program should take when the
event occurs.
Each event-handler is usually bound to a specific object
or control on a form.
Any additional subroutines, methods, or function
procedures required are usually placed in a separate code
module, and can be called from other parts of the
program as and when needed.
14
Background
Before the arrival of object-oriented programming languages, event
handlers would have been implemented as subroutines within a
procedural program.
The flow of program execution was determined by the programmer,
and controlled from within the application’s main routine.
The complexity of the logic involved required the implementation
of a highly structured program.
All of the program’s code would be written by the programmer,
including the code required to ensure that events and exceptions
were handled, as well as the code required to manage the flow of
program execution.
15
Visual Basic, Controls, and
Events
16
Visual Basic, Controls, and Events
1. An Introduction to Visual Basic
2. Visual Basic Controls
3. Visual Basic Events
17
An Introduction to Visual
Basic 2010
Why Windows and Why Visual Basic
How You Develop a Visual Basic Application
The Different Versions of Visual Basic
18
Visual Basic 2010
Language used to create Windows applications.
Provides a Graphical User Interface or GUI.
The sequence of instructions executed in the program is
controlled by events.
19
Sample Input Screen
20
How to Develop a Visual Basic
Application
Design the Interface for the user.
Determine which events the controls on the
window should recognize.
Write the event procedures for those events.
21
Different Versions of Visual Basic
Version 1.0 – 1991 Version 2.0 – 1992
Version 3.0 – 1993 Version 4.0 – 1995
Version 5.0 – 1997 Version 6.0 – 1998
Visual Basic.NET – 2002 (NOT BACKWARD
COMPATIBLE WITH EARLIER VERSIONS)
Visual Basic 2005 – November 2005
Visual Basic 2008 – November 2007
Visual Basic 2010 – April 2010
22
Visual Basic Controls
Starting a New Visual Basic Program
Text Box Control
Button Control
Label Control
List Box Control
Name Property
Fonts / Auto Hide
Positioning and Aligning Controls
23
Visual Basic Start Page
24
Start a New Project
25
New Project Dialog Box
select
click on OK button
26
Initial Visual Basic Screen
27
Toolbox
28
4 Ways to Place a Control from the
Toolbox onto the Form Designer
Double-click
Drag and Drop
Click, Point, and Click
Click, Point, and Drag
29
Four Controls at Design Time
text box
To select a control, click on it. Sizing handles will appear when
a control is selected.
30
Text Box Control
Used for input and output
When used for output, ReadOnly property is set to
True
Tasks button
sizing handles
31
Properties Window
Press F4 to
display the
Properties
window for the
selected control.
categorized view alphabetical view
32
Properties Window (continued)
selected control
properties settings
Description pane
33
Some Often Used Properties
Text
Autosize
Font.Name
Font.Size
ForeColor
BackColor
ReadOnly
34
Setting Properties
Click on property name in left column.
Enter its setting into right column by typing or
selecting from options displayed via a button or
ellipses.
35
Setting the ForeColor Property
1. Click on ForeColor.
2. Click on button at right of
settings box.
3. Click on Custom tab to
obtain display shown.
4. Click on a color.
36
Font Property
1. Click on Font in left
column.
2. Click on ellipsis at right
of settings box to obtain
display shown.
3. Make selections.
37
Button Control
The caption on the button should indicate the
effect of clicking on the button.
Text property
38
Add an Access Key
39
Label Control
Used to identify the contents of a text box.
Text property specifies caption.
By default, label automatically resizes to
accommodate caption on one line.
When the AutoSize property is set to False, label
can be resized manually. AutoSize is used
primarily to obtain a multi-rowed label.
40
List Box Control
Initially
used to display several pieces of output.
In Chapter 4 used to select from a list.
41
The Name Property
Used by the programmer to refer to a control in
code
Setting for Name property near top of Properties
window
Use appropriate 3-character naming prefix
Use descriptive names
42
Control Name Prefixes
Control Prefix Example
button btn btnCompute
label lbl lblAddress
text box txt txtAddress
list box lst lstOutput
43
Renaming the Form
Initial
name is Form1
The Solution Explorer window lists a file named
Form1.vb.
To rename the form, change the name of this file
to newName.vb
newName should begin with prefix frm.
44
Fonts
Proportional width fonts, such as Microsoft Sans
Serif, use less space for "I" than for "W"
Fixed-width fonts take up the same amount of
space for each character – like Courier New
Fixed-width fonts are used for tables.
45
Auto Hide
Hides Toolbox when not in use
Vertical push pin icon indicates auto hide is
disabled.
Click the push pin to make it horizontal and enable
auto hide.
push pin
46
Positioning Controls
proximity
line
47
Aligning Bottoms of Controls
snap line
48
Aligning Middles of Controls
snap line
49
Tab Order
• The tab indices determine the
order in which controls
receive the focus during
tabbing.
• The control whose TabIndex
property is set to 0 has the
focus when the program
begins.
50
Visual Basic Events
An Event Procedure Walkthrough
Properties and Event Procedures of the Form
The Header of an Event Procedure
51
Event
An event is an action, such as the user clicking on
a button
Usually, nothing happens in a Visual Basic
program until the user does something and raises
an event.
What happens is determined by statements inside
the event procedure.
52
Sample Statements
txtBox.ForeColor = Color.Red
txtBox.Visible = True
txtBox.Text = "Hello World"
General Form:
controlName.property = setting
53
Sample Form
txtFirst
txtSecond
btnRed
54
Focus
When you click on a text box, a cursor appears in
the text box, and you can type into the text box.
Such a text box is said to have the focus.
If you click on another text box, the first text box
loses the focus and the second text box receives
the focus.
55
Examples of Events
btnShow.Click
txtBox.TextChanged
txtBox.Leave
General Form:
controlName.event
56
The Three Steps in Creating a Visual
Basic Program
1. Create the interface; that is, generate, position,
and size the objects.
2. Set properties; that is, configure the appearance
of the objects.
3. Write the code that executes when events occur.
57
Code Editor
Code Editor tab Form Designer tab
58
Display Events for a Control
Select the control
Click on the Events
button ( ) in the
Properties window events button
59
Structure of an Event Procedure
header Private Sub objectName_event(...)
Handles objectName.event
statements
End Sub
(...) is filled automatically with (ByVal sender
As System.Object, ByVal e As
System.EventArgs)
60
Create an Outline for an Event
Procedure
Double-click on a control
or Select a control, click on the Events button in
the Properties window, and double-click on an
event
(We nearly always use the first method.)
61
Sample Form
txtFirst
txtSecond
btnRed
Double-click on txtFirst to create the outline for the Code
Editor
62
Code for Walkthrough
Public Class frmDemo
Private Sub txtFirst_TextChanged(...)
Handles
txtFirst.TextChanged
txtFirst.ForeColor = Color.Blue
End Sub
End Class
63
IntelliSense
Automatically pops up to help the programmer.
txtFirst.
64
Code Editor
click tab to return to Form Designer
65
Sample Form
txtFirst
txtSecond
btnRed
Double-click on btnRed to return to Code Editor and add
the outline of an event procedure
66
Code for Walkthrough
Public Class frmDemo
Private Sub txtFirst_TextChanged(...)
Handles txtFirst.TextChanged
txtFirst.ForeColor = Color.Blue
End Sub
Private Sub btnRed_Click(...)
Handles btnRed.Click
txtFirst.ForeColor = Color.Red
End Sub
End Class
67
Event Procedure txtFirst.Leave
Select txtFirst on the form
Click on the Events button in the Properties
window
Double-click on Leave
68
Code for Walkthrough
Private Sub txtFirst_Leave(...)
Handles txtFirst.Leave
txtFirst.ForeColor = Color.Black
End Sub
Private Sub txtFirst_TextChanged(...)
Handles txtFirst.TextChanged
txtFirst.ForeColor = Color.Blue
End Sub
Private Sub btnRed_Click(...) Handles btnRed.Click
txtFirst.ForeColor = Color.Red
End Sub
69
Header of Event Procedure
Private Sub btnRed_Click(…) Handles btnRed.Click
Name, can be changed. Identifies event
Private Sub Button_Press(…) Handles btnRed.Click
70
Handling Multiple Events
An event procedure can be invoked by two events.
Private Sub Happening(...)
Handles
btnRed.Click,txtSecond.Leave
txtFirst.ForeColor = Color.Red
End Sub
71
Altering Properties of the Form
Thefollowing won't work:
frmDemo.Text = "Demonstration"
Theform is referred to by the keyword Me.
Me.Text = "Demonstration"
72
Open and Run an Existing Program
Click on Open Project in the File menu.
Navigate to the program’s folder.
Double-click on the program’s folder to open it.
Double-click on the file with extension sln.
In the Solution Explorer double-click on the file
with extension vb. (The Form Designer will
appear.)
Press F5 to run the program.
73
Activity
Design a graphical user interface by following the
instructions carefully.
