Event Manual Ver 1.1

Bahir Dar University
Bahir Dar Institute of Technology

School of Computing
Laboratory Manual
Course title: Event Driven Programming
Prepared By: Mekonnen Fentaw
Reviewed by: Mekonnen Wagaw
2006E.C
Bahir Dar University
Bahir Dar Institute of Technology
School of Computing
Approval Certification of the Reviewer
I have certified and approved Event Driven Programming laboratory manual prepared by Mekonnen
Fentaw. As I have reviewed and commented the manual it carries out the objectives, tasks, exercises
and completes practical parts of the course and fulfills the standard of the curriculum of the course.
Mekonnen Wagaw ____________________ ________________
Name Signature Date

Contents
Objectives .......................................................................................................................................................... 4
Introduction ....................................................................................................................................................... 1
Overview of the Visual Studio .NET IDE ........................................................................................................... 1
Menu Bar and Toolbar ................................................................................................................................... 5
Visual Studio .NET IDE Windows ................................................................................................................. 6
Lab-1: C# console application ........................................................................................................................... 12
Lab-2: C# Windows application ........................................................................................................................ 17
Lab 3:- Basic controls I ...................................................................................................................................... 23
Lab 4:- Basic controls II ..................................................................................................................................... 29
Lab 5:- Dialog Boxes ......................................................................................................................................... 33
Lab 6:- Menu and Tool bar ............................................................................................................................... 37
Lab 7:- Timer .................................................................................................................................................... 40
Lab 8:- Setup & deployment ............................................................................................................................. 43
Lab 9:- Regular expression................................................................................................................................ 47
Lab 10:- Database I ........................................................................................................................................... 51
Lab 11:- Database II .......................................................................................................................................... 60
Lab 12:- Report ................................................................................................................................................ 67
Objectives
After successful completion of these laboratory exercises, students will be able to
1. Develop software using rapid Application Development concepts

2. Apply visual programming concepts and tools in short period of time with sophisticated
features;
3. Understand areas of studies including file management, database programming, object
oriented programming, and advanced concepts in visual programming including client server
development
Event Driven Programming Manual
Introduction
Visual Studio .NET is Microsoft’s Integrated Development Environment (IDE) for creating, running
and debugging programs (also called applications) written in a variety of .NET programming
languages. This IDE is a powerful and sophisticated tool that is used to create business-critical and
mission-critical applications. This manual provides an overview of the Visual Studio .NET IDE and
demonstrate how to create a simple Visual Basic program by dragging and dropping predefined
building blocks into place (a technique called “visual programming.”). Moreover, additional features
of the IDE and advanced “visual programming” techniques will be introduced and discussed in the
manual.
Overview of the Visual Studio .NET IDE

When Visual Studio .NET is executed, the Start Page is displayed. The left- hand side of the Start
Page contains a list of helpful links, such as Get Started. Clicking a link displays its contents. We
refer to single-clicking with the left mouse button as selecting, or clicking, whereas we refer to
double-clicking with the left mouse button as double- clicking. [Note: Your Start Page may be slightly
different depending on your version of Visual Studio.]
Prepared By Mekonnen Fentaw

1
The Visual Studio .NET IDE organizes programs into projects and solutions. Projects are groups of
related files that form a Visual Basic program; solutions contain one or more projects. Multiple-project
solutions are used to create large-scale applications in which each project performs a single, well-
defined task.
The Visual Studio .NET IDE provides project types for a variety of programming languages. This
manual focuses on Visual C#, so select the Visual C# Projects folder from the Project Types
window in new project dialoge. A Windows Application, which is a program that executes inside
the Windows OS (e.g., Windows 2000 or Windows XP). Such programs include customized soft-
ware that you create as well as software products like Microsoft Word, Internet Explorer and Visual
Studio .NET.

2
By default, the Visual Studio .NET IDE assigns the name WindowsApplication1 to the new project
and solution as shown in the following figure. The Visual Studio Projects folder in the My
Documents folder is the default folder referenced when Visual Studio .NET is executed for the first
time. Programmers can change both the name and the location where projects are created.
After selecting a name and location for the project, click OK to display the IDE in design view as shown
in the following figure, which contains all the features necessary to begin creating Visual C# programs.

3
The gray rectangle (called a form) titled Form1 represents the Windows application that the
programmer is creating. Later in this manual, you will learn how to customize this form by adding
controls (i.e., reusable components, such as buttons). Collectively, the form and controls constitute the
program’s Graphical User Interface (GUI), which is the visual part of the program with which the
user interacts. Users enter data (inputs) into the program by typing at the keyboard, by clicking the
mouse buttons and in a variety of other ways. Programs display instructions and other information
(outputs) for users to read in the GUI. The name of each open document is listed on a tab. In our case,
the documents are the Start Page and Form1.vb [Design] (upper left portion of above figure). To
view a document, click its tab. Tabs save space and facilitate easy access to multiple documents.
The active tab, or the tab of the document currently displayed in the IDE, is displayed in bold text

4
(e.g., Form1.vb [Design]) and is positioned in front of all the other tabs.
Menu Bar and Toolbar
Commands for managing the IDE and for developing, maintaining and executing programs are
contained in the menus, which are located on the menu bar as shown below. Menus contain groups
of related commands (also called menu items) that, when selected, cause the IDE to perform specific
actions (e.g., open a window, save a file, print a file and execute a program). For example, new
projects are created by selecting File > New > Project....
The menus depicted in the above figure are summarized in the figure below. In the manual, you
will be introduced how to create and add your own menus and menu items to their projects.
Visual Studio .NET IDE menu bar.
Menu Description
File Contains commands for opening projects, closing projects, printing project data, etc.
Edit Contains commands such as cut, paste, find, undo, etc.
View Contains commands for displaying IDE windows and toolbars.
Project Contains commands for managing a project and its files.
Build Contains commands for compiling a program.
Debug Contains commands for debugging (i.e., identifying and correcting problems in a
program) and running a program.
Data Contains commands for interacting with databases (i.e., files that store data, which
we discuss in Chapter 19, Databases, SQL and ADO .NET).
Format Contains commands for arranging and changing the appearance of a form’s controls.
Tools Contains commands for accessing additional IDE tools and options that enable
customization of the IDE.
Windows Contains commands for arranging and displaying windows.

5
Help Contains commands for accessing the IDE’s help features.
Visual Studio .NET IDE Windows

The IDE provides windows for accessing project files and customizing controls. In this section, we
introduce several windows that are essential in the development of Visual Basic applications. These
windows can be accessed via the toolbar icons or by selecting the name of the desired window in the
View menu.
Visual Studio .NET provides a space saving feature called auto hide, which can be activated by
clicking the pin icon in the upper right corner of a window. When auto-hide is enabled, a toolbar
appears along one of the edges of the IDE. This toolbar contains one or more icons, each of which
identifies a hidden window. Placing the mouse pointer over one of these icons displays that window,
but the window is hidden once the mouse pointer is moved outside the window’s area. To “pin down”
a window (i.e., to disable auto-hide and keep the window open), click the pin icon. Notice that when a
window is “pinned down,” the pin icon has a vertical orientation, whereas when auto-hide is
enabled, the pin icon has a horizontal orientation.

6
Visual Studio .NET IDE has different basic Windows namely solution explorer, tool box, property
window, error list window, output window and etc. Let us see the first three
Solution Explorer
The Solution Explorer window provides access to all the files in the solution. When the Visual Studio
.NET IDE is first loaded, the Solution Explorer is empty; there are no files to display. Once a solution
is open, the Solution Explorer displays that solution’s contents.

7
The solution’s startup project is the project that runs when the program is executed and appears in bold
text in the Solution Explorer. For our single-project solution, the startup project is the only project
(WindowsApplication1). The Visual Basic file, which corresponds to the form shown in figure
above, is named Form1.vb. (Visual Basic files use the .vb filename extension, which is short for
“Visual Basic.”) The other files and folders are discussed later in the manual.
The plus and minus boxes to the left of the name of the project and the References folder expand and
collapse the tree, respectively. Click a plus box to display items grouped under the heading to the right
of the plus box; click the minus box to collapse a tree already in its expanded state. Other Visual
Studio .NET windows also use this plus-/minus-box convention.
The Solution Explorer window includes a toolbar that contains several icons. When clicked, the
show all files icon displays all the files in the solution. The number of icons present in the toolbar is
dependent on the type of file selected. We discuss additional toolbar icons later in the book.
Toolbox
The Toolbox contains controls used to customize forms. Using visual programming, programmers
can “drag and drop” controls onto the form instead of writing code to build them. Just as people do

8
not need to know how to build an engine in order to drive a car, programmers do not need to know
how to build a control in order to use the control. The use of preexisting controls enables developers
to concentrate on the big picture, rather than the minute and complex details of every control. The wide
variety of controls that are contained in the Toolbox is a powerful feature of the Visual Studio .NET
IDE.
The Toolbox contains groups of related controls (e.g., Data, Components). When the name of a
group is clicked, the list expands to display the various controls contained in the group. Users can
scroll through the individual items by using the black scroll arrows to the right of the name of the
group. If there are no more members in a group to reveal by scrolling, the scroll arrow appears in
gray, meaning that it is disabled, i.e., it will not perform its normal function if clicked. The first item
in the group is not a control—it is the mouse pointer. The mouse pointer is used to navigate the

9
IDE and to manipulate a form and its controls. In this manual, you will be introduced many of the
Toolbox’s controls.
Properties Window
The Properties window (shown in the figure below) displays the properties for a form or control.
Properties specify information such as size, color and position. Each form or control has its own set of
properties; a property’s description is displayed at the bottom of the Properties window whenever that
property is selected. If the Properties window is not visible, accessing View > Properties Window, or
pressing F4, displays the Properties window.
In above figure, the form’s Properties window is shown. The left column of the Properties window
lists the form’s properties; the right column displays the current value of each property. Icons on the
toolbar sort the properties either alphabetically (by clicking the Alphabetic icon) or categorically (by

10
clicking the Categorized icon). Users can scroll through the list of properties by dragging the
scrollbar’s scrollbox up or down. We show how to set individual properties later throughout the
manual.
The Properties window is crucial to visual programming; it allows programmers to modify controls
visually, without writing code. This capability provides a number of benefits. First, programmers
can see which properties are available for modification and, in many cases, can learn the range of
acceptable values for a given property. Second, the programmer does not have to remember or search
the Visual Studio .NET documentation for the possible settings of a particular property. Third, this
window also displays a brief description of the selected property, helping programmers understand
the property’s purpose. Fourth, a property can be set quickly using this window—usually, only a
single click is required, and no code needs to be written. All of these features are designed to help
programmers avoid repetitive tasks while ensuring that settings are correct and consistent
throughout the project.
At the top of the Properties window is the component selection drop-down list, which allows
programmers to select the form or control whose properties are displayed in the Properties window.
When a form or control in the list is clicked, the properties of that form or control appear in the
Properties window.

11
Lab-1: C# console application

Aim
Students will develop c# console application that is used to accept two numbers and compute their sum.
User interface of the completed application looks like the following figure.
Objective:
Students will be familiar with visual studio integrated development environment.
After successful completion of this lab, students will get the following technical skills
 Building application
 Testing application
 Declare and initialize int variable using C#
 Display interactive message on console
 Accept input from console
 Perform mathematical computation and display the result on console
Procedures
1. Start visual studio (start buttonall programs Microsoft Visual Studio 2008 Microsoft
Visual Studio 2008)

12
2. Create new project

a. click Project link indicated in figure 1 or click file menunew Project
Figure 1: Integrated development environment
b. Click the arrow indicated by arrow labeled arr1 in order to choose C# programming
language as back end programming language. Click sub menu window, indicated by
arrow labeled arr4, to indicate that the project is windows based( not web based).
Choose console Application , indicated by arrow labeled arr2, on template panel.
Type your project name in the text box , indicated by arrow labeled arr3. Finally click
ok button

13
The following code is automatically generated for you after you clicked ok button.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
namespace ConsoleApplication1
{
class Program
{
static void Main(string[] args)
{
}
}
}
3. Type the following code in the body of Main method
int n1, n2, sum = 0;

Console.Write("Enter the first number ");
n1 = int.Parse(Console.ReadLine());
Console.Write("Enter the second number ");
n2 = int.Parse(Console.ReadLine());
sum = n1 + n2;
Console.Write("sum=" + sum);

14
Console.ReadLine();
4. Build and test your application

a. In order to test whether your code is working as we expect or not, click Debugstart
debugging or click F5 function key or click start debugging icon, indicated in the figure
below, on tool bar
The following console screen output is displayed after you click start debugging , input 10 and 20, and
finally press enter key.
Algorithm
1. Begin
2. Initialize variable sum to zero
3. Accept two numbers
4. Compute sum of the number and put it on the variable sum
5. Display the result on the console
Coding
C# equivalent of the above algorithm is shown in the figure 2. Let us see the code one by one. From
line 1 to 4, each line of code starts with the key word using. Its equivalent in java is import, and in

15
C++ is #include. In order to use Console.ReadLine(),we need to use/import System, as indicated in

line number 1. There is a key word namespace at line 6. namespace in C# is a package in java. Syntax
of namespace declaration in C# is shown below.
Syntax: Example:
namespace namespace_name{ namespace finance_code{
//code //code
} }
Every C# console application must have main method as indicated in line 10 to successfully build and
test functionalities of application. We need to declare three variables n1 and n2 to hold input values,
sum to hold computed values. Console.WriteLine() is used to print the text in the console.
Console.ReadLine() is used to accept inputs from standard input devices such as key board in the form
of string. Therefore, we need to convert the input string into integer using int.Parse() method. We need
to type Console.ReadLine() as indicated in line 20 to pause console output.

16
Figure 2: code window for C# console application
Lab-2: C# Windows application

Aim
Students will develop simple windows application that is used to accept two numbers and compute
their sum using c#.

17
Objective:
Students will be familiar with visual studio IDE so as to develop simple windows based application.
 Design user interface

o Add controls on forms
o Rearrange their position
o Set their properties
 Attach code
o Declare and initialize int variable using C#
o Accept inpust from TextBox
o Perform mathematical computation
o Display the result on TextBox
 Build and test application
Procedures
1. Start visual studio (start buttonall programs Microsoft Visual Studio 2008 Microsoft
Visual Studio 2008)

18
a. click Project link indicated in figure 1 or click file menunew Project

b. Click the arrow indicated by arrow labeled arr1 in order to choose C# programming
language as back end programming language. Click sub menu window, indicated by
arrow labeled arr4, to indicate that the project is windows based( not web based).
Choose Windows Application, indicated by arrow labeled arr2, on template panel.
Type your project name in the text box, indicated by arrow labeled arr3. Finally click
ok button
Figure 3: new Project dialoge for Window Application
3. Design user interface
Designing user interface includes activities like adding different controls to a form, re-arranging their
position and sequences in the form and setting their properties.
a. Drag and drop controls on a form
The following user interface is generated and displayed after you clicked ok button in step 2 above. To
start designing user interface, We need to add controls on our form to design user interface. we need

19
to have three labels for static text, three text boxes for input/output, two buttons for action/codes. Click
the plus sign indicated by the arrow in figure 5 in order to get button,textbox and label controls. Drag
and drop controls indicated by arrows in figure 6 to your form.
Figure 4:Common controls components

Figure 5: Common Control expand/shrink button
b. Rearrange the position of controls as indicated below

20
Figure 6: Form design after Controls re-arranged
c. Set properties of control using the values given below

Control Property name value
name
label1 Text firstNumber
label2 Text SecondName
label3 Text Sum
textBox1 Name txtNum1
textBox1 Name txtNum2
textBox1 Name txtSum
Figure 7: form design after controller's property is set
button1 Name btnAdd
Text Add
button2 Name btnCrear
Text Clear
form1 Text My Frist C#
windows
Application
4. Attach code behind add and clear button

a. Double click Add Button and attach the code shown in figure 9
Algorithm
1. Begin
2. Initialize variable sum to zero
3. Accept two numbers
4. Compute sum of the number and put it on the variable sum
5. Display the result on the console

21
Coding
The code shown in figure 8 is automatically generated for you after you double clicked Add button.
You are expected to add you own code in the body of btnAdd_Click() method.
Figure 8: Automatically generated code for lab2
Let us see the code given in figure 9. Line 21 is variable declaration. n1 and n2 are used to store input
values. Sum is used to hold computed value. Line 22 and 23 are used to accept inputs from user
interface to our code. Any value typed on any text box is obtained by using Text property. If the name
of a TextBox is textBox1, the input values is obtained by textBox1.Text. Since any value typed on
textbox is considered as a text, we need to convert the input text to a number format using int.Parse()
or Convert.ToInt16(). The sum of the input number is computed at line 24.

22
Figure 9: source code for lab2
b. Double click clear button and attach the following code
The purpose of clear button is to remove contents of text boxes.

txtNum1.Clear();
txtNum2.Clear();
txtSum.Clear();
5. Build and test your application
Lab 3:- Basic controls I

Aim
Students will develop windows application that allow users to format static text based on font style
and/or color the selection done by the user.

23
Objective
Students will be able to use basic controls such as Check box, radio button and group panel.
After successful completion of this lab, students will get the following skills
 Set ForColor of Text of controls

 Format font styles (such as Underline,Italic and Bold ) of Text of TextBox if the
corresponding checked status of CheckBox is true.
 Remove font styles applied on Text of TextBox if the corresponding checked status of
CheckBox is false.
Procedures
1. Start visual studio as shown in Lab 1 and Lab2

2. Create new windows applications as shown in Lab 1 and Lab2
a. Add two GroupBox controllers to the form. One of them is used to group check boxes
and the other one is used to group radio buttons. GroupBox control is shown in the
following figure.

24
b. Add three check boxes on the first GroupBox, three radio buttons on the second
GroupBox, and one text boxes outside GroupBoxes.
c. Re-arrange controls as indicated above and set their corresponding properties using the
following information.
Controller Property Property values
type name
GroupBox1 Text Font style

25
GroupBox2 Text Color

Check Box1 Text Underline
Name chkUnderline
Check Box2 Text Bold
Name chkBold
Check Box3 Text Italic
Name chkItalic
Radio Button1 Text Red
Name rbnRed
Radio Button2 Text Blue
Name rbnBlue
Radio Button3 Text Yellow
Name rbnYellow
Text Box1 Name txtPreview
Text If you're connected to a local area network,
you might already be connected to the Internet.
To find out, open your web browser and try
accessing a website.
Multiline True
4. Attach codes
Double click Underline check box, type the following code on the body of the method

26
Figure 10- code for underline style
Figure 11-code for Bold style
Double click Italic check box, type the following code on the body of the method
Figure 12-code for Italic style

27
Code descriptions
Let us see codes for underline style. Codes used in bold and italic are of the same type.
We need to declare two font variable. The first one is used to hold the new formatting. The second font
variable indicated at line 22 is used to store previous style formatting. The code at Line 24 is used to
check whether underline check box is clicked or not. If it is checked, the code at line 25 is used to
change style formatting. The constructor of Font has two parameters. The first parameter is all about
font face such as Times New Roman. The second parameter is all about font style such as underline,
Bold, Italic, Regular and etc. When you look at the second parameter, you will see single pipe
symbol. This operator is used to add underline style in addition to previous style formatting. If you
replace line 25 by the following code, then previous style formatting such as italic, bold will be
removed.
font = new Font(currentFont, FontStyle.Underline);
If you unchecked the underline check box, the else block at line 27 will be executed. XOR operator is
used instead of pipe operator. It is used to remove underline style formatting.
// Logical exclusive-OR
// When one operand is true and the other is false, exclusive-OR

// returns True.
Console.WriteLine(true ^ false);
// When both operands are false, exclusive-OR returns False.
Console.WriteLine(false ^ false);
// When both operands are true, exclusive-OR returns False.
Console.WriteLine(true ^ true);
Let us see the difference between single and double ampersand symbols and pipe symbols.
'&&' and '||' are what's called "short-circuiting" logical operators. In the case of &&, if the first operand
is false, then it doesn't bother evaluating the second operand, because the whole expression is certain to

28
be false. In the case of ||, if the first operand is true, then it doesn't bother evaluating the second
operand, because the whole expression is certain to be true.
'&' and '|' can also be used as logical operators though it's more common for them to be used as bitwise
operators. When they're used as logical operators, both operands are always evaluated.
The code ate line 29 changes font of txtPreview textbox to the selected font
Double click each radio button, type the following code on the body of the methods
Figure 13-code for color changes
In order to change color of textbox, we need to use ForeColor property of the textbox. We can use
RGB color code or static fields of Color class as can be seen in above figures.
Lab 4:- Basic controls II

Aim
Students will develop simple windows application that allows users to format selected text in
richTextBox based on font face and/or font size selection done by the user.

29
Objective
Students will be able to use basic controls such as list box, combo box, and rich text box.
After the completion of this lab, you will get the following technical skills
 Writing codes on form load in order to execute some tasks immediately after form is
constructed.
 format texts of controls programmatically.
 Populating values on comboBox and listBox
 Obtain selected values on comboBox and listBox, and use the selected value in the code
 Use ForEach loop
 Declare and initialize String array variable
 Format only selected texts

30
Procedures
1. Start visual studio

a. Add controls to form and adjust their position in such a way that the user interface look
like the following figure.
b. Set their properties based on the given information on the table below.
Control name Property Value
name
Form 1 Text Lab4
Label1 Text font face
Label2 Text font face
listBox1 Name lbxFontFace
ComboBox1 Name cmbSize
RichTextBox1 Name rtxPreview
Dock Bottom
4. Attach codes

31
a. Write codes in form load
There is a need to populate numbers on cmbSize combo box and populate font names of windows 7 on
lbxFontFace. In order to populate values on controls, we need to type code on form load. Double
click Form1, type the following code.
Code descriptions
Code at line 21 declares a string array that holds names of some fonts in windows 7 operating system.
Codes from line 26 to line 28 are used to populate listBox items. Codes from line 30 to line 34 are used
to populate comBox items
b. Double click ListBox and type the following codes.

32
Code descriptions
Font class has 13 constructors. The constructor used at line 42 has two parameters. The first parameter
is of type String and the second parameter is of type float. The code at line 40 holds the selected font
face name in the listBox. The code at line 41 is used to hold font size of the richTextBox.
SelectionFont property of richTextBox is used at line 42 to apply formatting on only selected text.
c. Double click ComboBox and type the following codes.
Lab 5:- Dialog Boxes

Aim
Students will develop windows application that allows users to type text, format text, save texts in hard
disk, open saved plain text in richTextBox. The application is mini word processor. Unlike other word
processors, the application does not have menus and tool bars.

33
Objective
Students will be able to use dialog boxes such Open file dialog, save file dialog, font dialog and
color dialog.

o Design mini word processor
o Add dialog controls on forms
o Set their properties
 Attach code
o Set initial directory of dialogBoxes
o Set title of dialogBoxes
o Set filter criteria of dialogBoxes
o Launch dailogBox to let user browse and select their file to open
o Write codes to check whether Ok button is clicked or not.
o Write codes to be executed if Ok button of the dialog is clicked
o Write codes to be executed if Cancel button of the dialog is clicked
Procedures
1. Start visual studio and create new project

a. Drag and drop richTextBox control to the form
b. Drag and drop 4 buttons on the form
c. Expand Dialogs subcategory of ToolBox and drag and drop the following controls on
the form
i. openFileDialog control
ii. SaveFileDialog control
iii. FontDialog control
iv. colorDialog control
d. Set properties of controls based on the following information

34
Control Name Property Value

Name
richtextBox Name rtxFileContent
Button1 Name btnOpen
Text Open
Button2 Name btnSave
Text Save as
Button3 Name btnColor
Text Font Color
Button4 Name btnFont
Text Font
openFileDialog1 Name openFileDialog1
SaveFfileDialog1 Name openFileDialog1
fontDialog1 Name fontDialog1
ColorDialog1 Name colorDialog1
Panel1 borderStyle Fixed3D
Dock Top
3. Attach code
a. Double click Open button and type the following code.

35
Code descriptions
The code at line 23 is used to set the default initial directory for the dialog. This means that if you click
open button, the open dialog is displayed with all folders and files in C:\ drive. The code at line 24 is
used to set the title of open dialog with Load file. The code at line 25 is used to filter files based on their
extensions. If your use “xx|*.xx | yy|*.yy”, the underline literal texts are displayed in the combo box and.
If a user selects xx, then your program will use wildchar character to filer files. That means, your
program will display all folders and files with xx extension. The code at line 26 is used to display Open
dialog and returns DialogResult object. The code at line 27 checks whether a user click ok button or
not. If user clicks ok button, the dialog will be closed and the code at line 28 will be executed. If a user
clicks cancel button, your application will close the dialog. The code at line 28 is used to display
contents of the file in richTextBox.
b. Double click Save button and type the following code
c. Double click Font button and type the following code
d. Double click Font button and type the following code

36
Lab 6:- Menu and Tool bar

Aim
Students will develop mini word processor.
Objective
Students will be able to use menu, context menu, tool bar and status bar.
Technical skills

o Design menu based mini word processor
o Create menu items that contain images, access keys, shortcut keys, and check marks

37
o View and hide components
 Attach code
o Attach codes behind menu items
o Navigate from one form to other form
Procedures

a. Drag and drop MenuStrip control on form from Menus & ToolBars
b. Select menuStrip1 control object that is indicated by arrow 1 in figure 14. A textbox is
displayed at left top corner of the form. Type name of the first menu items in the text
box indicated by arrow 2. Whenever you try to type the first menu items in the text box
indicated by arrow 2, two text boxes are displayed automatically. One of them is
displayed on right side, the other one is displayed below the current menu. You can
create different menu tree structure using these two textboxes. Create a file menu
consists of submenus open, save and exit. Create a edit menu consists of submenus
copy, cut and paste in similar fashion.
Figure 15:- File menu
Figure 14: MenuStrip control Object

38
c. Drag and drop toolStrip control on form from Menus & ToolBars
d. You can create toolStrip components one by one. For this lab, let us use standard items.
To insert standard items, right click on toolStrip control object, click Insert Standard
Items. Delete buttons such as new, print and help as indicated in the following figure.
To delete, right click on the object that you want to delete , then click delete.
e. Drag RichTextBox from Common Controls subcategory and drop on the form.
3. Set properties of richTextBox based on the following information.
Name
richtextBox Name rtxArea
Dock Fill
Let us take the default name for menu items.
4. Attach code
a. For menu Items
i. Double click open sub men item and add the code in lab 5 3 (a)
ii. Double click save sub men item and add the code in lab 5 3 (b)
iii. Double click exit sub men item and add the code the following code
Application.Exit();

39
iv. Double click copy sub men item and add the code the following code
rtxArea.Copy();
v. Double click cut sub men item and add the code the following code
rtxArea.Paste();
vi. Double click cut sub men item and add the code the following code
rtxArea.Cut();
b. For tool bar
i. Double click open button and add the code in lab 5 3 (a)
ii. Double click save button and add the code in lab 5 3 (b)
iii. Double click copy button and add the code the following code rtxArea.Copy();
iv. Double click cut button and add the code the following code rtxArea.Paste();
v. Double click cut button and add the code the following code rtxArea.Cut();
Exercise
1. Add third menu named View, and add submenu named tool bar. The purpose of the submenu is
to hide and unhide the tool bar you create so far. Write C# code that is used to hide and unhide
the standard tool bar.
2. Add font and color menu discussed in lab 5. Add their corresponding codes.
3. Change image properties of menu items.
Lab 7:- Timer

Aim
Students will develop installable alarm application. User interface of alarm application looks like the
following figure.

40
Objective
Students will be able to use timer control to run block of code repeatedly on regular time interval
given by user.
Technical skills

o Use DateTime controller
o Use timer controller
o Design alarm application and develop setup application
 Attach code
o Set properties of DateTime and Timer controller programmatically
o Retrieve values and use values of DateTime Controller
o Attach codes behind timer control
Procedures
Part 1: for alarm

41

a. Drag 1 textBoxes, 2 buttons, 5 labels, 2 comboBoxes and 2 DateTimePickers from
common controls subcategory and drop them on the form.
b. Drag timer control objects from Components subcategory and drop on the form
3. Set controls properties based on the following information
Control Name Property Name Value
Button1 Name btnStart
Text Start
Button2 Name btnStop
Text Stop
textBox2 Multiline True
Name txtNote
Label1 Text alarm time
Label2 Text Repeat
Label3 Text note for alarm
comboBox1 Name cmbStatus
Items Off
On
comboBox2 Name cmbRepeatType
Items Once
every day
Timer Name Alarm
Form Text Timer and Deployement
DateTimePicker1 Format Time
CustomFormat “HH:mm”
ShowUpDown True
4. Attach codes
a. Double click stop button and add the following code.
alarm.Enabled = false;
b. Double click start button and add the following code.

42
c. Double click alarm timer control objects and add the following code.
// using System.Media; for SystemSounds

System.Media.SystemSounds.Hand.Play();
if (cmbRepeatType.SelectedItem.ToString().Equals("once"))
alarm.Enabled = false;
else if (cmbRepeatType.SelectedItem.ToString().Equals("every day"))
alarm.Interval = 1000 * 60 * 60 * 24;
Lab 8:- Setup & deployment

Aim
Students will develop a setup application for alarm developed in lab 7.
Objective
Students will be able to use setup and Deployment Project type to develop redistributable application.

43
Technical skills
 Tasks
o Add project that is intended to be installed
o Create setup project
o Associate primary outputs of project with setup projects
o Create short cut for start menu and desktop
o Build alarm project and setup project : set properties of setup project
 Set Properties of setup application

o Set Manufacturer, Product name, Title, and author of the applications
Procedures
Step 1: create setup project

We need to create setup project. To create setup project, expand solution explorer, right click on
you project, select add, click new project. Expand other project types indicated by arrow
number 1. Select Setup and Deployment category indicated by arrow number 2 and then
select Setup project indicated by arrow number 3 on Templates section. Type name of setup in
the textbox indicated by arrow number 4.

44
Step 2: add project that is intended to be installed

a. Select alarmSetup
b. Right click Application folder
c. select add
d. click Project output. The following figure is displayed

45
e. Select Primary output

f. Click Ok
Step 3: create short cut for start menu and desktop

To create start menu short cut,
a. Right click on Primary output from Lab7.
b. Click Create Shortcut to primary output from lab7.
c. cut the shortcut and paste on User’s Programs Menu
To create start menu short cut,
a. Right click on Primary output from Lab7.

b. Click Create Shortcut to primary output from lab7.
c. cut the shortcut and paste on User’s Desktop

46
Step 4: set properties of setup project

a. Expand solution explorer, and then select your setup project(alarmSetup).
b. Open property window and set the following properties
Property name Values
Author Abebe (your name)
Manufacture BDU
Manufacturer URL Bdu.edu.et
Product name AlarmSetup
Title Alarm setup
Step 5: Build alarm project and setup project

Before you tried to build setup project, make sure that there is no files or folder in the
~/Lab7\AlarmSetup\Debug and Lab7\AlarmSetup\Release. There are two ways of building
project. These are Debug and Release mode. Debug mode is used when we want to build
project in design and development environment where as release mode is used when we want to
build project in production environment. Since default build mode is debug mode, your setup
file is generated and saved on Lab7\AlarmSetup\Debug . you can take one of these files using
Flash to install it on different computers.
a. Click Build menu
b. Click Build AlarmSetup or Click shift +F6
Lab 9:- Regular expression

Aim
Students will design user registration form with validation of fields using regular expression User
interface of the intended application looks like the following figure.

47
Figure 16:- UI with valid input

Figure 17:- UI with invalid inputs
Objective
Students will be able to use regular expression to validate and match input strings or numbers.
Technical skills
 Attach code
o Students will be able write C# codes with regular expression that are used to validate
inputs
Procedures

a. Drag 3 textBoxes, 1 buttons and 6 labels from common controls subcategory and drop
them on the form.
Button1 Name btnValidate
Text Validate
textBox1 Name txtFullName

48
textBox2 Name txtMobileNo

textBox3 Name txtAge
Label1 Text Full name
Label2 Text Mobile Number
Label3 Text Age
Label4 Text
Name lblErrorInName
Visibility False
Label5 Text
Visibility False
Name lblErrorInMobileNo
Label6 Text
Name lblErrorInAge
Visibility False
4. Attach codes
a. Double click Validate button and add the following code.
Before tryinh type the following codes, add the following code at the beginning of your code.
using System.Text.RegularExpressions;
lblErrorInAge.Visible = true;
lblErrorInMobileNo.Visible = true;
lblErrorInName.Visible = true;
//for name validation

//any valid name should have first name and last name.
//Each of them should be collection alphabetic letters
Regex rgx = new Regex("^([a-zA-Z]+ [a-zA-Z]+)$");
string name = txtFullName.Text;
if (rgx.IsMatch(name))

49
{
lblErrorInName.Text = "valid name ";
}
else
{
lblErrorInName.Text = "invalid name ";
}
//for mobile number validation

//any valid mobile number begines with 09 and then followed by hiphen followed by
// 4 digit numbers and then hiphen and then 4 gigit numbers
Regex rgxForMobile = new
Regex("^(09-[0-9]{4}-[0-9]{4})$");
string mobile = txtMobileNo.Text;
if (rgxForMobile.IsMatch(mobile))
{
lblErrorInMobileNo.Text = "Valid Mobile no";
}
else
{
lblErrorInMobileNo.Text = "inValid Mobile no";
}
//for age validation

//any valid age between 18 and 150
Regex rgxForAge = new
Regex("^(([2-9][0-9])|(1[89])|(1[0-4][0-9])|(150))$");
string age = txtAge.Text;
if (rgxForAge.IsMatch(age))
{
lblErrorInAge.Text = "valid age";

50
}
else
{
lblErrorInAge.Text = "invalid age";
}
Lab 10:- Database I

Aim
Students will develop application that retrieve and display customer information. The application gives
users a chance to see records of all customers or customers in a selected country.
Students are required to download Northwind sample database from internet and attach Microstoft SQL
Server database. If you are not able to download, you can collect it from Instructor. Lab 9 depends on
Customers table indicated below.
User the final interface lab nine looks like the following figure

51
Objective
Students will be able to connect visual C# application with SQL server database in order to manipulate
data on a give database.
Technical skills
 Attach code
o Students will use data source wizard to retrieve and display data on dataGridView
controls
o Students will write codes used to retrieve data from database and display on
dataGridview
Procedures

Task1 retrieving data using Data Source wizard

52

a. Drag SplitContainer control from Container category and drop them on the form,
Drag DataGridView controller from Data category and drop it on the first panel of
SplitContainer.
dataGridView1 Dock Fill
4. Populate the dataGridview with data from database using datasource wizard
a. Select data grid view
b. Select DataSource property, and click the drop down arrow. You will see the following
user interface.
c. Click Add Project Data source

d. Select Database indicated by arrow number 1 in the following figure and click next

53
e. Click New Connection as show in the following figure

54
f. Select Microsoft SQL server and click Continue as indicated in the following figure
g. Type server name on the textBox(Note: server name may vary based on sql server
edition. If your computer name is PC, then server name will be PC for standard edition
of SQL Server and PC/ SQLEXPRESS for express edition of SQL Server). To find
server name: open Microsoft SQL server softwareright click on the server found at
object browser select propertiescopy the value of Name propery

55
h. Click Select or enter database name radio button. Click drop down button , then select
database that you want to connect

56
i. Click Test Connection button to check whether the connection is working fine or not.
j. Click Ok button
k. Click next
l. Click next. The following user interface will be displayed after you click next button.

57
m. Expand Table category

n. Expand Customers table
o. Select CustomerID,CompanyName, ContactTitle, City and Country
p. Click Finish button
q. Build and Test
Task2 retrieving data using C# code

a. Drag DataGridView controller from Data category , label and ComboBx controller
from Common controls category and drop it on the second panel of SplitContainer.
dataGridView1 Dock Bottom
label1 Text Company
comboBox1 Name cmbCompany
3. Attach codes

58
We need to populate combo box with country names immediately after a form is generated. Populating
comboBox should not require human to click a button or select element in controls. When a user selects
a country from combo box, information of customers from the selected country will be populated in
dataGridview2.
a. Populate comboBox
i. Double click the form
ii. Import SqlClient using the following line of code
“using System.Data.SqlClient;”
iii. Create connection objects in the form load block
SqlConnection con = new SqlConnection("Data Source=MEKONNEN-PC\\SQLEXPRESS;Initial

Catalog=Northwind;Integrated Security=True");
iv. Create SQL command object

SqlCommand cmd=new SqlCommand("select distinct country from Customers",con);
v. Open connection
con.Open();
vi. Create SQL data reader object
SqlDataReader reader= cmd.ExecuteReader()
vii. Populate each rows returned by the data reader on comboBox
while(reader.Read()){
cmbCompany.Items.Add(reader[1]);
}
viii. Close connection

con.Close();
b. Populate dataGridView
We need to write codes that listen changes on selected item in the comboBox.

59
i. Double click on comboBox

ii. Type codes used to obtain the selected country
String company = cmbCompany.SelectedItem.ToString();
iii. Create connection object
SqlConnection con = new SqlConnection("Data Source=MEKONNEN-
PC\\SQLEXPRESS;Initial Catalog=Northwind;Integrated Security=True");
iv. Create SqlDataAdapter object
SqlDataAdapter da = new SqlDataAdapter("select * from Customers where

country='"+company+"'", con);
v. Create dataTable object

DataTable dt = new DataTable("customer");
vi. Open connection
con.Open();
vii. fill the collected data on dataTable objects
da.Fill(dt);
viii. close connection
con.Close();
ix. Set the datasource of dataGridview
dataGridView2.DataSource = dt;
Lab 11:- Database II

Aim
Students will develop application that retrieve and display information from multiple tables. Whenever
a user selects a customer, the application will display details of orders done by the selected customers.
The application should have login and main (information) forms.
Students are required to create an account table in Northwind database. Use the following SQL
command to create the required table and to insert sample record.

60
create table account (userName nvarchar(50)not null, password nvarchar(50));

insert into account values('test','test');
Lab 11 depends on Customers, [Order Details], Orders and Products table. Their attributes and
relationship is shown below.

61
The required application has two user interfaces. The first user interface is login form. The second one
is a form that displays information retrieved from database.
Figure 18:-Login form
Figure 19:-Main Form

62
Objective
Students will be able to retrieve records from multiple tables using parameterized query.
Technical skills
 Students will write code that is used to

o Hold full information of selected record in first dataGridView control object and display
order details of the selected record in another dataGridView control object.
o Protect from SQL injection using parameterized SQL query.
o Navigate from one page to other pages.
o Handle form’s close button event
Procedures
Task1 add one form in addition to the default form
Before adding the second form, rename the first form with new name ‘LoginForm’. In order to add
new form, use the following steps.
-right click one on your project select Add select New Itemsselect Windows Forms on
Categories section from the left panselect Windows Form in Templates section from right
pantype ‘Mainform’ in the Name textboxclick Add button.
Task2 Design login form

a. Drag 3 Labels, 3 Buttons, 1 PictureBox and 2 TextBoxes from Common controls
category and drop them on the form.
Label1 Text USER NAME
Label2 Text PASS WORD

63
Label3 Text
Name lblError
TextBox1 Name txtUserName
TextBox2 Name txtPassWord
PasswordChar *
Button1 Text Login
Name cmdLogin
Button2 Text Clear
Name cmdClear
Button3 Text Create new account
Name cmdCreateNewAccount
Visibile False
PictureBox1 Dock Right
SizeMode StretchImage
Image Steps:
 Select Image property
 Click the 3 dots
 Click import
 Browse any picture you like
 Click open button
 Click ok button
Form1 Name frmLoginForm
Text LoginForm
BackColor Cyan
ForColor DarkGoldenrod
Font Size 12
Font Name Algerian
4. Attach code
a. Double click Login button and the following codes

64
b. Double click Clear button and the following codes
c. Double click Create New Account button and the following codes
d. Build and Test.
Task2 Design Main form

a. Drag SplitContainer control object from Container category, 2 DataGridView control
objects from Data category and drop them on the form.

65

SplitContainer Orentation Hirozontal
DataGridView1 Dock Full
SelectionMode FullRow
DataGridView2 Dock Bottom
Form1 Name frmMainForm
Text Lab10 DB-II
3. Attach code
a. Double click Main From and the following codes in the Form Load block
b. Double click dataGridView1and add the following codes

66
c. Build and Test.
Lab 12:- Report

Aim
Students will design and develop RDLC report that will present detail order information done by
customers. The report should display a customer followed by details of orders done by him/her.
Lab 12 depends on Customers, [Order Details], Orders and Products table. Their attributes and
relationship is shown in Lab 11.

67
The required application will have the following user interface.
Figure 20:-Lab12 Final UI
Objective

68
Students will design and develop RDLC report and integrate the report design with C# application
using MicrosoftReportViewer control object.
Technical skills
After successful completion of this lab, students will be able to
 Create DataSet that will be used in report later

 Design report using report wizard
 Imbed different images in RDLC report
 Use group to classify information based on specified attribute
 Integrate the report with C# application using MicrosoftReportViewer controls
Procedures
Task1 Creating a strongly-typed data set
In order to create dataset, use the following steps.
-right click one on your project select Add select New Itemsselect Data on Categories section
from the left panselect DataSet in Templates section from right pantype ‘CustomerOrders in the
Name textboxclick Add button. The following user interface is shown by the IDE after you clicked
Add button.

69
We need SQL query that is used to populate the dataset. To build a query, use the following steps.
Step-1. right click on empty space show in the above figureselect Addclick TableAdapter
Step-2. The following wizard is displayed after you click TableAdapter in above step. If you
have data connection, select it from the comboBox and click Next button. If there is no data
connection in the comboBox, create new data connection by clicking New Connection button.
Refer lab10 for details.

70
Step-3. Select Use SQL statement radio button and click next button.
Step-4. Now we are ready to write SQL statement. We have two options to build SQL
statement. The first option is simply writing your own SQL in the textbox. The second option is
using Query builder. If you choose the first one, put your query in the textBox ; click next and
go to Step-5. If you choose the second option, click Query Builder button as shown in the
following figure and go to Step-7.

71
Step-5. Click next
Step-6. Click Finish button

Step-7. Select one or more tables in the list and click add button

72
Step-8. Select one or more attributes from one or more tables. The query is automatically built
for you whenever you select an attribute from a table. Click Ok button. The following user
interface is displayed after you clicked Ok button. Go to Step-5 and Step-6 to complete the
wizard.

73
Step-9. The following user interface is displayed after you clicked Ok button in Step-8. Go to
Step-5 and Step-6 to complete the wizard.

74
Task2 Designing the report on the basis of dataset
Step-1. Using the Solution Explorer, right click on your project  select Add  click New Item.
Note: The name of the report file will end with the extension “rdlc,” which stands for “report definition
language for client” (or for local mode). If you deal with SQL Server Reporting Services, it will have
the extension “rdl” only, i.e. server mode
Step-2. Select Reporting from category section select Report Wizard from Templates section. Type
CustomerOrders.rdlc in Name textbox. Click Add button.
Step-3. Click Next button

Step-4. Select the dataset created in Task-1 as indicated in the following figure and click next

75
Step-5. select Tabular radio button and click next

Step-6. Select CustomerId and Click Group buttonselect CompanyName and click Group
buttonselect ContactName and click Group button. In similar fashion, add ProductName, Quantity,
UnitPrice, ShippedDate and ShipCity in Detail block as indicated in the figure below. Click Next
button

76
Step-7. Select Stepped radio button and click Next button

Step-8. Select Slate and click Next button
Step-9. Click Finish button
Step-10. Insert header and footer: click Report menuclick Page Header and Page Footer
Step-11. Drag textbox control from tool box and drop it on header section. Type the text indicated in
Figure 20.
Step-12. Drag textbox control from tool box and drop it on footer section. Type the text indicated in
Figure 20.
Step-13. Imbed external images:-click Report menuEmbedded Imagesclick New Image button and
add at two images.
Step-14. Drag two Image controls and drop them on the header section.
Step-15. Set properties of Images: select the first image controlgo to property window Set the value
of Source property =Embedded; set the value of Value property =[name of your embedded image]
Step-16. Display lines between cells:-select cellsgo to property windowSet the value of
BorderStyle=Solid and BorderColor=Black
Task3 Displaying the report using Reportviewer


77
a. Drag MicrosoftReportViewer from Reporting category and drop them on the form.
b. Click Smart Tag at top right corner of MicrosoftReportViewer
c. Click ComboBox named Choose Report
d. Select the report you created in Task-2
Name
MicrosoftReportViewer Dock Fill
3. Build and Test

78

Event Manual Ver 1.1

Uploaded by

Copyright:

Available Formats

You might also like

Event Manual Ver 1.1

Uploaded by

Document Information

Original Description:

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Event Manual Ver 1.1

Uploaded by

Copyright:

Available Formats

Bahir Dar University

Bahir Dar Institute of Technology

Course title: Event Driven Programming

Prepared By: Mekonnen Fentaw

Reviewed by: Mekonnen Wagaw

Bahir Dar Institute of Technology

Approval Certification of the Reviewer

Mekonnen Wagaw ____________________ ________________

Name Signature Date

1. Develop software using rapid Application Development concepts

Overview of the Visual Studio .NET IDE

Prepared By Mekonnen Fentaw

Prepared By Mekonnen Fentaw

Prepared By Mekonnen Fentaw

Prepared By Mekonnen Fentaw

Menu Bar and Toolbar

Edit Contains commands such as cut, paste, find, undo, etc.

View Contains commands for displaying IDE windows and toolbars.

Project Contains commands for managing a project and its files.

Build Contains commands for compiling a program.

Windows Contains commands for arranging and displaying windows.

Prepared By Mekonnen Fentaw

Help Contains commands for accessing the IDE’s help features.

Visual Studio .NET IDE Windows

Prepared By Mekonnen Fentaw

Prepared By Mekonnen Fentaw

Prepared By Mekonnen Fentaw

Prepared By Mekonnen Fentaw

Prepared By Mekonnen Fentaw

Prepared By Mekonnen Fentaw

Lab-1: C# console application

Students will be familiar with visual studio integrated development environment.

Prepared By Mekonnen Fentaw

2. Create new project

Figure 1: Integrated development environment

Prepared By Mekonnen Fentaw

3. Type the following code in the body of Main method

int n1, n2, sum = 0;

Prepared By Mekonnen Fentaw

4. Build and test your application

Prepared By Mekonnen Fentaw

C++ is #include. In order to use Console.ReadLine(),we need to use/import System, as indicated in

Prepared By Mekonnen Fentaw

Figure 2: code window for C# console application

Lab-2: C# Windows application

Prepared By Mekonnen Fentaw

 Design user interface

Prepared By Mekonnen Fentaw

a. click Project link indicated in figure 1 or click file menunew Project

Figure 3: new Project dialoge for Window Application

3. Design user interface

a. Drag and drop controls on a form

Prepared By Mekonnen Fentaw

Figure 4:Common controls components

b. Rearrange the position of controls as indicated below

Prepared By Mekonnen Fentaw

Figure 6: Form design after Controls re-arranged

c. Set properties of control using the values given below

Mekonnen Wagaw ____