You are on page 1of 18

Visual programing (CS-692/CS-783)

Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093


Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

Note:

It is intimated that following Lectures will not be repeated and would be part
of mid-term & final exam as well.
(Week 4) Lecture # 7:

Objective:

 Windows Form Application


 Events
 Properties
 GUI Programming Techniques(Phases)
 Calculation Program Example

Windows Form Application:

Sequential programming model is used by console based applications, in which application starts
from a point, performs some input/output, selection or iterative operations and stops to another
point.

In event driven programming model, application starts from a point and then it enters a message
loop. This message loop monitors different events which may occur on application, application
executes different event handlers which are associated with these events.

Introduction to Visual Studio .Net environment:

Visual Studio .Net 2008 programming environment is shown below:


Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

Following windows is visible when we select File  New  Project menu items from main
window of visual studio .Net.

Main window of IDE of Visual Studio .Net is shown in following figure, when a template type
of Windows Form Based Application is selected.

Following toolbox is used to place different user interface elements on a form for a form based
application.
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

GUI Programming Technique: Programming technique for GUI based applications is based on
three phases, which are described as follows:

a) Analysis Phase: Gathering information about problem statement and checking


solution which is already exisists and planning which feature should be extended or
changed.
b) Designing Phase: Preparation of Object Property Sheet and Object Activity Sheet
documents for application.
c) Coding/Programming Phase: Development of GUI application in Visual Studio .Net
by designing GUI layout from planing phase, then setting properties of GUI elements
of application using Object Property Sheet. Further programming for event handler
functions is done by using Oject Activity Sheet.

Object Property Sheet: This sheet contains information about properties and their values for
different GUI elements for a given GUI screen.

Sr # Control Name Property Value


1 Label Text Enter 1st value
Name lblVal1

Object Activity Sheet: This sheet represents pseudo code of event handler functions which are
associated with an event which is caused on a user interface element.

Sr # Control Name Event Pseudo-Code


1 Button Click  Validate all fields that is no will will be left empty.
 Show message validate successfully or not.
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

4 2
1

1-Solution Explorer
The Solution Explorer lists the files in the project. One of the most important is Form1.cs, which
defines the controls and code for the form named Form1. If you double-click a file in the Solution
Explorer, the IDE opens it in the editing area.

2-Editing Area
The editing area displays files in appropriate editors. Most often you will use this area to design
forms (place controls on them and set control properties) and write code for forms, but you can also use
this area to edit other files .

3-Properties Window
The Properties window lets you set control properties. Click a control on the Form Designer to
select it, or click and drag to select multiple controls. Then use the Properties window to set the control(s)
properties. Notice that the top of the Properties window shows the name and type (System
.Windows.Forms.name of control) of the currently selected control.
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

4-Toolbox
The Toolbox contains controls and components that you can place on a form. Select a tool and
then click and drag to put a copy of the tool on the form. Notice that the Toolbox groups controls in tabs
(All Windows Forms, Common Controls, Containers, Menus & Toolbars, and so on) to make finding the
controls you need easier.

Calculation Program:

Create an application which inputs two integer type values from user in a text box. There are four button
named as ADD, SUB, MUL, DIV which performs addition of two number, subtraction of two numbers,
multiplication of two numbers and division of two numbers respectively. And show result in another
textbox of read-only property as TRUE. There is another button named as CLEAR which clears all text
box values, and EXIT button closes the application.

2
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

From the tool box drag the required components to the form.

From the toolbox drag all the required components and controls to the form one by one to design
the form .
Drag 4 labels. And 3 text box one for first value second for value 2 and third for show result
and six buttons on form.as shown in the figure below
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

Set the text on all the text on all the labels from properties window as shown in the figure below

Set the Text as


Enter value 1

Right click the label --> properties set the text on Label from properties window
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

Assign the name to all the text Box form the properties window as shown figure below .
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

Right click the text Box and select the properties


Change Name of text Box as txtVal1
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

From porperties Set the name as txtVal1

From porperties Set the name as txtVal2

From porperties Set the name as txtRes

From the properties set the Text and


the name property for each button

For the add button set the name as btnAdd and set the Text as ADD
For the SUB button set the name as btnSub and set the Text as SUB
For the MUL button set the name as btnMul and set the Text as MUL
For the Divide button set the name as btnDiv and set the Test as Divide
For the Clear button set the name as btnClear and set the Text as Clear
For the Exit button set the name as btnExit and set the Text as Exit
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

Double click the ADD button to create the Click event .Double click will create the event for the
ADD button as shown below.

private void btnAdd_Click(object sender, EventArgs e)


{

}
This function will be called on the click of the ADD button .we have to write the code of ADD
Button in this function.

By double click on each button in the GUI we can create the function for each button to perform
the functionality of the each button.

Solution:
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace calculationApplication
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}

private void btnAdd_Click(object sender, EventArgs e)


{
if (txtVal1.Text == "")
{
MessageBox.Show("Enter value 1");
txtVal1.Focus();
}
else if (txtVal2.Text == "")
{
MessageBox.Show("Enter 2nd value");
txtVal2.Focus();
}
else
{
int v1, v2, res;
v1 = int.Parse(txtVal1.Text);
v2 = int.Parse(txtVal2.Text);
res = v1 + v2;
txtRes.Text = res.ToString();
}
}

private void btnSub_Click(object sender, EventArgs e)


{
if (txtVal1.Text == "")
{
MessageBox.Show("Enter value 1");
txtVal1.Focus();
}
else if (txtVal2.Text == "")
{
MessageBox.Show("Enter 2nd value");
txtVal2.Focus();
}
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

else
{
int v1, v2, res;
v1 = int.Parse(txtVal1.Text);
v2 = int.Parse(txtVal2.Text);
res = v1 - v2;
txtRes.Text = res.ToString();
}
}

private void btnMul_Click(object sender, EventArgs e)


{
if (txtVal1.Text == "")
{
MessageBox.Show("Enter value 1");
txtVal1.Focus();
}
else if (txtVal2.Text == "")
{
MessageBox.Show("Enter 2nd value");
txtVal2.Focus();
}
else
{
int v1, v2, res;
v1 = int.Parse(txtVal1.Text);
v2 = int.Parse(txtVal2.Text);
res = v1 * v2;
txtRes.Text = res.ToString();
}
}

private void btnDiv_Click(object sender, EventArgs e)


{
if (txtVal1.Text == "")
{
MessageBox.Show("Enter value 1");
txtVal1.Focus();
}
else if (txtVal2.Text == "")
{
MessageBox.Show("Enter 2nd value");
txtVal2.Focus();
}
else if (int.Parse(txtVal2.Text) == 0)
{
MessageBox.Show("Divide by zero is not allowed");
txtVal2.Focus();
}
else
{
int v1, v2, res;
v1 = int.Parse(txtVal1.Text);
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

v2 = int.Parse(txtVal2.Text);
res = v1 / v2;
txtRes.Text = res.ToString();
}
}

private void btnClear_Click(object sender, EventArgs e)


{
txtVal1.Text = string.Empty;
txtVal2.Text = string.Empty;
txtRes.Text = string.Empty;
}

private void btnExit_Click(object sender, EventArgs e)


{
Application.Exit();
}
}
}

(Week 4) Lecture # 8:

Objective:

 Employee Salary
 Exception Handling

Exception Handling

In the c# for the exception handling we will use the try catch to handle the exception.

 The try block will contain the guarded code that may cause an exception so that if any errors
occurred in our code, then immediately the code execution will be moved to catch block to
handle those exceptions.

 In a try-catch statement, the catch block will execute only when an exception occurred in
the code that is guarded by try block.
Syntax
try
{
// code that may raise exceptions
}
catch(Exception ex)
{
// handle exception
}
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

Employee Salary

Change the Name property as txtEmpNo

Change the Name property as txtName

Change the Name property as txtSalary

Change the Name property as txtTax

Change the Name property as txtDeduction

Change the Name property as txtNetSalary

Change the Name property as txtAnnualSalary

Change the TEXT property as &Calculate and Name as btnCalculate

To change the properties right click the control and click on


property.

1- Change the Name of the calculate button as btnCalcualte and the text as &Calculate
here we used the & before the Calculate & will make the c as short cut key which will
be used as alt+c will cilck the calculate button.
2- In the clear button we will use the r as short key for this purpose we will set the Text
property as Clea&r here we use & before the r to make the r as shot key .
And set the Name as btnClear.
3- In the Exit button we will use the X as short key for this purpose we will set the Text
property as E&xit here we use & before the X to make the X as shot key .
And set the Name as btnExit from property window.
Now we Create the event for each Button .for this Double click the Button .for example
if we Double the Calculate button the following function will be created which will be
associated with Calculate Button .
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

private void btnCalculate_Click(object sender, EventArgs e)


{
\\here write the code for Calculate button
}

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace EmployeeForm
{
public partial class Form1 : Form
{
float bsal, tax, deduction, nsal, asal;

public Form1()
{
InitializeComponent();
}

private void btnCalculate_Click(object sender, EventArgs e)


{
if (txtEmpNo.Text == string.Empty)
{
MessageBox.Show("Employee Number");
txtEmpNo.Focus();
}
else if (txtName.Text == string.Empty)
{
MessageBox.Show("Name");
txtName.Focus();
}
else if (txtSalary.Text == string.Empty)
{
MessageBox.Show("Salary");
txtSalary.Focus();
}
else if (txtDeduction.Text == string.Empty)
{
MessageBox.Show("Deduction");
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

txtDeduction.Focus();
}
else
{
try
{
bsal = float.Parse(txtSalary.Text);
deduction = float.Parse(txtDeduction.Text);
tax = float.Parse((bsal * 0.06).ToString());
txtTax.Text = tax.ToString();
nsal = bsal - deduction - tax;
txtNetSalary.Text = nsal.ToString();
asal = nsal * 12;
txtAnnualSalary.Text = asal.ToString();
}
catch (Exception ex)
{
MessageBox.Show(ex.Message);
}
}
}

private void btnClear_Click(object sender, EventArgs e)


{
txtEmpNo.Text = string.Empty;
txtName.Text = string.Empty;
txtSalary.Text = string.Empty;
txtTax.Text = string.Empty;
txtDeduction.Text = string.Empty;
txtNetSalary.Text = string.Empty;
txtAnnualSalary.Text = string.Empty;
}

private void btnExit_Click(object sender, EventArgs e)


{
Application.Exit();
}
}
}
Visual programing (CS-692/CS-783)
Mr. Ikram Afzal email: ikram@biit.edu.pk Whatsapp#03345373093
Mr. Shahid Jamil email: shahid@biit.edu.pk Whatsapp#03155425199
Mr. Umar Farooq email: umar.farooq@biit.edu.pk Whatsapp#03327661819

You might also like