Event-driven programming using C#

Kitaw A.
 Graphical User Interfaces
A graphical user interface (GUI) allows a user to interact visually
with a program
A GUI window contains various GUI controls
A menu bar containing the menus
A tool bar of buttons
Tabs
Title bar
 Graphical User Interfaces
GUIs are built from GUI controls (which are sometimes called
components or widgets short for window gadgets)
GUI controls are objects that can display information on the screen or
enable users to interact with an app via the mouse, keyboard or some other
form of input (such as Barcode readers)
Most common GUI controls:
Label: Displays images or uneditable text.
TextBox: Enables the user to enter data via the keyboard. It can also be
used to display editable or uneditable text
Button: Triggers an event when clicked with the mouse
 Graphical User Interfaces
CheckBox: Specifies an option that can be selected (checked) or unselected
(not checked). The user can select 0 or more options
RadioButton: Specifies an option that can be selected or unselected. The
user can select only one option
ComboBox: Provides a drop-down list of items from which the user can
make a selection either by clicking an item in the list or by typing in a box
ListBox: Provides a list of items from which the user can make a selection
by clicking one or more items
Panel: A container in which controls can be placed and organized
NumericUpDown: Enables the user to select from a range of numeric input
values.
 Windows Forms
Windows Forms is a library that is used to create GUIs
A Form is a graphical element that appears on your computer’s desktop; it
can be a dialog, a window or an MDI window (multiple document interface
window)
A from contains other controls
A control, such as a Button or Label, has a graphical representation at
runtime
Some components lack graphical representations (e.g., class Timer of
namespace System.Windows.Forms)
Such components are not visible at run time
Windows Forms

Windows Controls
 Windows Forms
Every control has:
Properties
Used to change state of a control (e.g.: Button's text, label’s font)
Methods
A task performed by a control (clearing value of text fields, hiding a window)
Events
Events are user actions such as key press, clicks, mouse movements, etc., or some
occurrence such as download complete, time elapses
Applications need to respond to events when they occur
 Event handling
A user interacts with an app’s GUI to make use of the tasks that
the app should perform.
For example, when you write an e-mail in an e-mail app, clicking
the Send button tells the app to send the e-mail to the specified e-
mail addresses
GUIs are event driven
When the user interacts with a GUI component, the interaction
(known as an event) drives the program to perform a task
 Event handling
Common events (user interactions) that might cause an app to
perform a task include clicking a Button, typing in a TextBox,
selecting an item from a menu or combo box, closing a window
and moving the mouse
All GUI controls have events associated with them
Objects of other types can also have associated events as well
A method that performs a task in response to an event is called an
event handler, and the overall process of responding to events is
known as event handling
 Event handling
Event handler method:
A void method that receives two parameters when it’s called
1. An object reference typically named sender which is a
reference to the object that generated the event
2. A reference to an EventArgs object (or an object of an
EventArgs derived class), which is typically named e
• This object contains additional information about the
event that occurred
EventArgs is the base class of all classes that represent event
information
 Event handling
Event handler method:
Example:

private void OnClick( object sender, EventArgs e )

{
}
 Event handling
Event handling
To handle an event we need to subscribe to the event by providing
an event handler function
Example:
button.Click += OnClick;
 Form
A Form is a graphical element that appears on your computer’s desktop; and
contains other controls
Common Properties:
AcceptButton: Default Button that’s clicked for you when you press Enter
AutoScroll: bool value (false by default) that allows or disallows scrollbars
when needed
CancelButton: Button that’s clicked when the Escape key is pressed.
FormBorderStyle: Border style for the Form (Sizable by default).
Text: Text in the Form’s title bar.
StartPosition: determines the position of the form when it first appears
 Form
Common Methods:
Close: Closes a Form and releases all resources, such as the memory used
for the Form’s contents. NB: A closed Form cannot be reopened
Hide: Hides a Form, but does not destroy the Form or release its resources
Show: Displays a hidden Form
Common Event:
Load: Occurs before a Form is displayed to the user
 Message box
A message box is used to display simple dialog boxes that contain text,
buttons and symbols to inform or instruct the user
The MessageBox class is used to create these dialog boxes
The class contains a method named show that displays the dialog box
The following version of the method is commonly used:

public static DialogResult Show(string text, string caption,

MessageBoxButtons buttons, MessageBoxIcon icon);
 Message box
public static DialogResult Show(string text, string caption,
MessageBoxButtons buttons, MessageBoxIcon icon);

text (string): the message

caption (string): title of the message box
buttons (MessageBoxButtons): the buttons to be displayed (OkCancel,
YesNoCancel)
icon (MessageBoxIcon): determines message type (information, error,
warning, question)
DialogResult is a built-in enum with the following common values:
Ok, No, Yes, Cancel
 Message box
public static DialogResult Show(string text, string caption,
MessageBoxButtons buttons, MessageBoxIcon icon);

Example:
MessageBox.Show("Your email has been sent
successfully","Sucess",MessageBoxButtons.OK,MessageBoxIcon.Information);
 Controls
Common properties of controls:
BackColor: The control’s background color.
Enabled: Specifies whether the control is enabled (i.e., if the user can
interact with it). Typically, portions of a disabled control appear “grayed
out” as a visual indication to the user that the control is disabled
Focused: Indicates whether the control has the focus (only available at
runtime)
TabIndex: The tab order of the control
When the Tab key is pressed, the focus transfers between controls based on
the tab order. You can set this order.
Text: The text associated with the control
Visible: Indicates whether the control is visible.
 Controls
Common methods of controls:
Hide: Hides the control (sets the Visible property to false)
Select: Acquires the focus
Show: Shows the control (sets the Visible property to true)
 Controls: Label
Labels provide text information (as well as optional images) and are defined
with class Label (a derived class of Control)
A Label displays text that the user cannot directly modify
A Label’s text can be changed programmatically by modifying the Label’s
Text property
Common Properties:
Font: The font of the text on the Label.
Text: The text on the Label.
TextAlign: The alignment of the Label’s text on the control, horizontally (left, center or
right) and vertically (top, middle or bottom).
The default is top, left
 Controls: TextBox
A textbox (class TextBox) is an area in which either text can be displayed
by a program or the user can type text via the keyboard
A password TextBox is a TextBox that hides the information entered by the
user
As the user types characters, the password TextBox masks the user input by
displaying a password character
If you set the property UseSystemPasswordChar to true, the Textbox
becomes a password TextBox
 Controls: TextBox
Common Properties:
Multiline: If true, the TextBox can span multiple lines. The default value is
false.
ReadOnly: If true, the TextBox has a gray background, and its text cannot
be edited. The default value is false.
ScrollBars: For multiline textboxes, this property indicates which
scrollbars appear (None - the default, Horizontal, Vertical or Both).
Text: The TextBox’s text content.
UseSystemPasswordChar: When true, the TextBox becomes a password
TextBox, and the system specified character masks each character the user
types
 Controls: TextBox
Common Properties:
PasswordChar: optional to UseSystemPasswordChar, used to use user
defined character to mask the password
Common Event:
TextChanged: Generated when the text changes in a TextBox (i.e., when
the user adds or deletes characters)
KeyPress: Generated when a key is pressed in a textbox
Enter: Generated when the textbox is active
Leave: Generated when the textbox loses focus
 Controls: Button
A button is a control that the user clicks to trigger a specific action or to
select an option in a program
A GUI program can use several types of buttons, such as checkboxes and
radio buttons
All the button classes derive from class ButtonBase which defines common
button features
Common Properties
Text: Specifies the text displayed on the Button face
Common Event
Click: Generated when the user clicks the Button
 Controls: CheckBoxes and RadioButtons
C# has two types of state buttons that can be in the on/off or true/false
states, CheckBoxes and RadioButtons. Like class Button, classes CheckBox
and RadioButton are derived from class ButtonBase
CheckBoxes
A CheckBox is a small square that either is blank or contains a check mark
When the user clicks a CheckBox to select it, a check mark appears in the
box
If the user clicks the CheckBox again to deselect it, the check mark is
removed
You can also configure a CheckBox to toggle between three states (checked,
unchecked and indeterminate) by setting its ThreeState property to true
Any number of CheckBoxes can be selected at a time.
 Controls: CheckBoxes and RadioButtons
Common Properties
Checked: Indicates whether the CheckBox is checked
This property returns a bool value. The default is false (unchecked).
CheckState: Indicates whether the CheckBox is checked or unchecked with
a value from the CheckState enumeration (Checked, Unchecked or
Indeterminate)
Text: Specifies the text displayed to the right of the CheckBox.
ThreeState: When this property is true, the CheckBox has three states—
checked, unchecked and indeterminate
 Controls: CheckBoxes and RadioButtons
Common Event
CheckedChanged: Generated when the Checked or CheckState property
changes. This is a CheckBox’s default event
RadioButtons
Radio buttons (defined with class RadioButton) are similar to CheckBoxes
in that they also have two states—selected and not selected
However, RadioButtons normally appear as a group, in which only one
RadioButton can be selected at a time
Selecting one RadioButton in the group forces all the others to be
deselected. Therefore Radio Buttons are used to represent a set of mutually
exclusive options (i.e., a set in which multiple options cannot be selected at
the same time).
 Controls: CheckBoxes and RadioButtons
All RadioButtons added to a container become part of the same group. To
divide RadioButtons into several groups, they must be added to separate
containers, such as GroupBoxes or Panels
Common Properties
Checked: Indicates whether the RadioButton is checked
Text: Specifies the RadioButton’s text
Common Event
CheckedChanged: Generated every time the RadioButton is checked or
unchecked
 Controls: Combo Box
The ComboBox control combines TextBox features with a drop-down list, a GUI
component that contains a list from which a value can be selected
A ComboBox usually appears as a TextBox with a down arrow to its right
By default, the user can enter text into the TextBox or click the down arrow to display a
list of predefined items
If a user chooses an element from this list, that element is displayed in the TextBox
The maximum number of items that a drop-down list can display at one time is set by
property MaxDropDownItems
 Controls: Combo Box
Common Properties
DropDownStyle: Determines the type of ComboBox
Value Simple means that the text portion is editable and the list portion
is always visible
Value DropDown (the default) means that the text portion is editable but
the user must click an arrow button to see the list portion
Value DropDownList means that the text portion is not editable and the
user must click the arrow button to see the list portion
Items: The collection of items in the ComboBox control.
 Controls: Combo Box
Common Properties
SelectedIndex: Returns the index of the selected item, or -1 if none are
selected
SelectedItem: Returns a reference to the selected item
Sorted: Indicates whether items are sorted alphabetically. Setting this
property’s value to true sorts the items. The default is false.
Common Event
SelectedIndexChanged: Generated when the selected index changes (such
as when a different item is selected)
 Controls: ListBox
The ListBox control allows the user to view and select from multiple items
in a list
The CheckedListBox control extends a ListBox by including CheckBoxes
next to each item in the list
This allows users to place checks on multiple items at once, as is possible
with CheckBox controls
Users also can select multiple items from a ListBox by setting the ListBox’s
SelectionMode property
In both controls, scrollbars appear if the number of items exceeds the
ListBox’s viewable area
 Controls: ListBox

Common Properties
Items: The collection of items in the ListBox.
 Controls: ListBox
SelectedIndex: Returns the index of the selected item
If no items have been selected, the property returns -1
If the user selects multiple items, this property returns only one of the
selected indices
If multiple items are selected, use property SelectedIndices
SelectedIndices: Returns a collection containing the indices for all selected
items
SelectedItem: Returns a reference to the selected item
If multiple items are selected, it can return any of the selected items.
SelectedItems: Returns a collection of the selected item(s).
 Controls: ListBox
SelectionMode: Determines the number of items that can be selected and
the means through which multiple items can be selected
Values None, One (the default), MultiSimple (multiple selection allowed)
or MultiExtended (multiple selection allowed using a combination of
arrow keys or mouse clicks and Shift and Ctrl keys).
Sorted: Indicates whether items are sorted alphabetically
Setting this property’s value to true sorts the items
The default value is false
 Controls: ListBox
Common Methods
ClearSelected: Deselects every item.
Common Event
SelectedIndexChanged: Generated when the selected index changes
 Controls: CheckedListBox
Common Properties (All the ListBox properties, methods and events are
inherited by CheckedListBox)
CheckedItems: Accessible only at runtime, returns the collection of items
that are checked as a CheckedListBox.CheckedItemCollection
This is distinct from the selected item, which is highlighted (but not
necessarily checked)
CheckedIndices: Accessible only at runtime, returns indices for all checked
items as a CheckedListBox.CheckedIndexCollection
 Controls: CheckedListBox
CheckOnClick: When true and the user clicks an item, the item is both
selected and checked or unchecked
By default, this property is false, which means that the user must select an
item, then click it again to check or uncheck it.
Common Methods
GetItemChecked: Takes an index and returns true if the corresponding
item is checked.
SetItemChecked: Takes an index and Boolean value then sets item’s
checked status
 Adding/Removing Items to ListBoxes and ComboBoxes
To add items to a ListBox or to a CheckedListBox or to a ComboBox, we
must add objects to its Items collection
This can be accomplished by calling method Add to add a string to the
ListBox’s or CheckedListBox’s or ComboBoxes Items collection
myListBox.Items.Add( myListItem );
To remove items from a ListBox or from a CheckedListBox or from a
ComboBox, we must remove objects from its Items collection
This can be accomplished by calling method Remove or RemoveAt as
shown below
myListBox.Items.Remove( myListItem );
myListBox.Items.RemoveAt(myListBox.SelectedIndex );
 Controls: NumericUpDown
At times, you’ll want to restrict a user’s input choices to a specific range of
numeric values
This is the purpose of the NumericUpDown control
This control appears as a TextBox, with two small Buttons on the right side,
one with an up arrow and one with a down arrow
By default, a user can type numeric values into this control as if it were a
TextBox or click the up and down arrows to increase or decrease the value
in the control, respectively.
 Controls: NumericUpDown
Common Properties
DecimalPlaces: Specifies how many decimal places to display in the
control
Increment: Specifies by how much the current number in the control
changes when the user clicks the control’s up and down arrows
Maximum: Largest value in the control’s range.
Minimum: Smallest value in the control’s range.
Value: The numeric value currently displayed in the control.
Common Event
ValueChanged: This event is raised when the value in the control is
changed.
This is the default event for the NumericUpDown control.
 Controls: Timer
Timer is non-visual components that generate Tick event at a set interval
This interval is set by the Timer’s Interval property
The interval defines the number of milliseconds (thousandths of a second)
between events
By default, timers are disabled and do not generate events
The Enabled property is used to start and stop the timer
Common properties
Enabled: a Boolean value that starts or stops the timer
Interval: in milliseconds that defines the time between two tick events
Common Event
Tick: generated whenever the specified interval time elapses