C# & Windows GUI Applications: IT 3334: Integrative Programming and Techniques

Download as pptx, pdf, or txt
Download as pptx, pdf, or txt
You are on page 1of 63

IT 3334: Integrative Programming

and Techniques

C#
&
Windows
GUI Applications
Lecture Contents

• Introduction to Integrative Programming.


• Contrast between the functions of Windows
applications and console applications.
• GUI - graphical user interfaces.
• Windows forms and form properties.
• Control objects such as buttons, labels, and text
boxes to a form.
Windows Based Applications

• Windows Forms

• Events

• Controls
INTEGRATIVE
PROGRAMMING
&
TECHNIQUES

4
Chapter 9

Introduction to Windows Programming

C# Programming:
From Problem Analysis to Program Design
4th Edition
Contrasting Windows and Console
Applications

• Windows applications function differently


from console applications.

• Windows applications look differently from


console applications.

6
Contrasting Windows and Console
Applications by Functionality
• Console applications
– Each line in Main( ) executed sequentially –
then the program halts
• Windows applications
– Once launched, sits and waits for an event
– Sits in a process loop
• Event: notification from operating system
that an action, such as the user clicking the
mouse or pressing a key, has occurred
– Write event-handler methods for Windows apps7
C# Programming: From Problem Analysis to Program Design
Graphical User Interfaces
• Windows applications also look different
from console applications
• Interface: front end of a program
– Visual image you see when you run a program
• Graphical user interface (GUI) includes:
– Menus
– Text in many different colors and sizes
– Other controls (pictures, buttons, etc.)
C# Programming: From Problem Analysis to Program Design 8
Windows Applications
• Reference and import
System.Windows.Forms namespace
• Class heading definition
– Includes not only the class name, but a colon
followed by another class name
• Derived class (first class), Base class (second class)
• public class Form1 : Form
• Derived classes inherit from base class
•C# Programming:
No multiple inheritance within .NET
From Problem Analysis to Program Design 9
languages
Windows Applications (continued)
• Text - property of the Form class
– A property for setting/getting title bar caption
– Can be used in constructor
• Windows forms/controls offer many properties
including Text, Color, Font, and Location
• Execution begins in Main( ) method
– Main( ) is located in Program.cs file for the application
– Call to Run( ) method places application in process loop

C# Programming: From Problem Analysis to Program Design 10


using System.Windows.Forms; // Line 1
namespace Windows0 New
{ namespace
public class Form1 : Form
Base class referenced // Line 2
{
public Form1( ) // Line 3
Constructor
{
Text = "Simple Windows Application"; // Line 4
Sets }
title bar static void Main( )
caption {
Form1 winForm = new Form1( ); // Line 5
Application.Run(winForm); // Line 6
}
} Starts
} process
loop
C# Programming: From Problem Analysis to Program Design 11
Windows Application (continued)

Output
generated
from
Windows0
application

Figure 9-1 Windows-based form


C# Programming: From Problem Analysis to Program Design 12
Elements of Good Design
• Appearance matters
– Human-computer interaction (HCI) research
• Design considerations
– Consistency
– Alignment
– Avoid clutter
– Color
– Target audience

C# Programming: From Problem Analysis to Program Design 13


Using the IDE Editor
C# support categories
 Code Snippets. They are named with short
alias like for, forr, class etc
 How to activate?
 Type alias and press the Tab key twice

Or

Use IntelliSense menu to insert the code snippet

Press Ctrl+K+X to activate the code snippet list

Select Visual C#
14
Use Visual Studio to Create
Windows-Based Applications

Select
File
New Windows
Project Forms Browse
Application to
template location
to store
your
Name
work

Figure 9-2 Visual Studio New Windows application


C# Programming: From Problem Analysis to Program Design 15
Windows-Based Applications

Properties
Window

Toolbox Design View

Figure 9-3 Initial design screen


C# Programming: From Problem Analysis to Program Design 16
Windows-Based Applications (continued)

Figure 9-4 Dockable windows


C# Programming: From Problem Analysis to Program Design 17
Windows Based Applications

• Windows Forms
–Properties
–Events
Windows Forms
• Extensive collection of Control classes
• Top-level window for an application is called a
Form
• Each control has collection of properties and
methods
– Select property from an alphabetized list (Properties
window)
– Change property by clicking in the box and selecting
or typing the new entry at design time.
• C#Each control
Programming: has
From Problem collection
Analysis to Program Designof events. 19
Windows Form Properties

Property value
Properties

Figure 9-5 Properties window


C# Programming: From Problem Analysis to Program Design 20
Windows Form Properties
(change values at run time)
• Can set properties
using program
statements
– Table 9-1 shows
properties set
using Properties
window
• Selecting Code on
View menu shows Table 9-1 Form1 property changes
associated code
C# Programming: From Problem Analysis to Program Design 21
Windows Form Events

Figure 9-6 Form events


C# Programming: From Problem Analysis to Program Design 22
Inspecting the Code Generated
by Visual Studio
• Three source code
files ending with a .cs
extension are part of
the application
Expand Form1.cs
node to reveal the
Form1.Designer.cs
file

Figure 9-7 Solution Explorer window


C# Programming: From Problem Analysis to Program Design 23
Simple Windows Application
• IDE separates the source code into three
separate files
– Form1.cs: normally this is the only one you edit
– Form1.Designer.cs: holds the auto generated code
– Program.cs: contains the Main( ) method, where
execution always begins
• Form1.cs and Form1.Designer.cs both
include partial class definitions for the
Form1 class
C# Programming: From Problem Analysis to Program Design 24
Inspecting the Code - Form1.cs
• Number of namespaces automatically
added, including System.Windows.Forms
• Constructor calls InitializeComponent( )
method
public Form1( )
{
// Required for Windows Form Designer support.
InitializeComponent( );
}
•C# Programming:
This isFrom the file where event handler methods25
Problem Analysis to Program Design
will be placed
Inspecting the Code -
Form1.Designer.cs
• InitializeComponent( ) method included here
• #region Windows Form Designer generated
code preprocessor directive
– // do not modify the contents of this method with
the Code Editor
– Keyword “this.” precedes property name
• Refers to current instance of the class
– #endregion // Ends the preprocessor directive

C# Programming: From Problem Analysis to Program Design 26


InitializeComponent( ) Method
BackColor = Color.FromArgb (((Byte)(255)),
• Some of the ((Byte)(224)), ((Byte)(192)));
auto generated ClientSize = new Size(392, 373);
code in the Font = new Font("Arial", 12F, FontStyle.Bold,
GraphicsUnit.Point, ((Byte)(0)));
method ForeColor = Color.Blue;
– Added as Location = new Point(30, 30);
default values Margin = new Padding(4);
for properties MaximizeBox = false;
Name = "Form1";
or from
StartPosition = FormStartPosition.CenterScreen;
changing Text = "First Windows Application";
property values
C# Programming: From Problem Analysis to Program Design 27
Windows Based Applications

• Events
Windows Form Events
• Add code to respond to events, like button clicks
– Code goes into Form1.cs file

• From the Properties window, select the lightning


bolt (Events)
– Double-click on the event name to generate code
• Registers the event as being of interest
• Adds a heading for event-handler method

C# Programming: From Problem Analysis to Program Design 29


Windows Form Properties (continued)

Events
button
selected

Figure 9-6 Form1 events


C# Programming: From Problem Analysis to Program Design 30
Windows Form – Load Event
• Code automatically added to register event

• Code automatically added for method


heading
private void Form1_Load(object sender, EventArgs e)
{
}

• You add statement to event-handler method


body
this.BackColor
C# Programming: = Color.Azure;
From Problem Analysis to Program Design 31
Windows Form – FormClosing Event
• Code automatically added to register event

• Code automatically added for method


heading
private void Form1_FormClosing(object sender,
FormClosingEventArgs e)
{
}
• You add statement to event-handler method
body
MessageBox.Show("Hope
C# Programming: you are
From Problem Analysis to Program having
Design fun!"); 32
Running the Windows Application
• No changes Figure 9-8
needed in Output
the file that produced
has Main( ) when the
Close button
• Run like causes the
you do event-handler
console method to
applications fire
(F5 or
Ctrl+F5)
C# Programming: From Problem Analysis to Program Design 33
Windows Based Applications

• Controls
Controls
• Controls are all classes
– Button, Label, TextBox, ComboBox, MainMenu,
ListBox, CheckBox, RadioButton, and
MonthCalendar
• Each comes with its own predefined
properties and methods
• Each fires events
• Each is derived from the
System.Windows.Forms.Control class
C# Programming: From Problem Analysis to Program Design 35
Controls (continued)

Figure 9-9 Control class hierarchy


C# Programming: From Problem Analysis to Program Design 36
Standard Controls

Figure 9-10 Windows Forms controls


C# Programming: From Problem Analysis to Program Design 37
Controls (continued)
• Two procedures to place controls
– From Toolbox, double-click on control or drag and
drop

• Move, resize, and delete controls


• Format controls
– Align controls
– Make same size
– Horizontal and vertical spacing
C# Programming: From Problem Analysis to Program Design 38
Properties of the Control class

Table 9-2 Systems.Windows.Forms.Control class properties


C# Programming: From Problem Analysis to Program Design 39
Properties of the Control class
(continued)

Table 9-2 Systems.Windows.Forms.Control properties (continued)


C# Programming: From Problem Analysis to Program Design 40
Methods of the Control class
• Control class has over 75 properties and
over 100 methods
– Not all are useful for every class that derives
from it Table 9-3 includes
a short list of some
of the many
methods.
Explore MSDN
documentation
for more

Table 9-3 Systems.Windows.Forms.Control methods


C# Programming: From Problem Analysis to Program Design 41
Controls (continued)

Figure 9-11 GUI controls


C# Programming: From Problem Analysis to Program Design 42
Practical Tasks
• Write a Windows based application – pure
empty form with no any user added forms,
controls or events
Practical Tasks
• Write a Windows based application – pure
empty form with modified Text property at
design time using Properties window
Practical Tasks
• Write a Windows based application – pure
empty form with two event handlers:
• Event Load – when the form gets loaded
– To modify Text property and BackColor
property at run time
• Event FormClosing – when the form gets
closed – prior to app termination
– Call MessageBox.Show() method
Label Objects
• Provide descriptive text or labels for other
controls
• Instantiate object
Label labelName = new Label( );
• Add control to Form
this.Controls.Add(labelName);
• Set property values (some from Control
class)
– Text; TextAlign; Font; Location
C# Programming: From Problem Analysis to Program Design 46
Creating a TaxApp

Table 9-4 TaxApp Form1 properties

Properties set for the Form


container
C# Programming: From Problem Analysis to Program Design 47
Creating a TaxApp Form

Add Label
objects to
Form
object…
Use
options on
FORMAT
menu

Figure 9-12 Formatting Label objects

C# Programming: From Problem Analysis to Program Design 48


Adding Labels to TaxApp Form
Add Label objects, then set
their properties using the
Properties window
(View Properties window)

Table 9-5 TaxApp label5 object properties


C# Programming: From Problem Analysis to Program Design 49
TextBox Objects
• Used to enter data or display text during run
time
– Used for both input and output
• Instantiate object
TextBox textBoxName = new TextBox( );
• Add control to Form
this.Controls.Add(TextBoxName);
• Interesting properties
– MultiLine, ScollBars, MaxLength, PasswordChar,
CharacterCasing
C# Programming: From Problem Analysis to Program Design 50
TextBox Objects (continued)

Table 9-6 TextBox properties

C# Programming: From Problem Analysis to Program Design 51


TextBox Objects (continued)

Table 9-6 TextBox properties (continued)


C# Programming: From Problem Analysis to Program Design 52
Adding TextBox Objects to
TaxApp Form
Add TextBox objects,
then set their property
values

Table 9-7 TaxApp TextBox objects property changes


C# Programming: From Problem Analysis to Program Design 53
Button
• Enables user to click button to perform task
– If button has event-handler method and is registered as
an event to which your program is planning to respond,
event-handler method is called automatically when
button clicked

• Button object’s properties, methods, and events


– Inherits from Control (Table 9-2 & 9-3, slides 38-40)
• Text, Enabled, Focused, TabIndex

C# Programming: From Problem Analysis to Program Design 54


Adding Button Objects to
TaxApp Form
Add
Button
objects,
then set
their
property
values

Table 9-7 TaxApp button1 properties


C# Programming: From Problem Analysis to Program Design 55
Adding Button
Objects to
TaxApp Form
(continued)

Figure 9-14 Events


C# Programming: From Problem Analysis to Program Design 56
Adding Button Objects to
TaxApp Form (continued)
• When you double-click on event, an event-handler
method is created:
private void btnCompute_Click(object sender, System.EventArgs e)

{
}

• AND registers click event:


this.btnCompute.Click +=
new System.EventHandler(this.btnCompute_Click);

C# Programming: From Problem Analysis to Program Design 57


Adding Button Objects to
TaxApp Form (continued)
private void btnCompute_Click(object sender, System.EventArgs e)
{
string inValue;
double purchaseAmt, percent, ans;
inValue = txtPurchase.Text;
while (double.TryParse(txtPurchase.Text,out purchaseAmt)==false)
{
MessageBox.Show("Value entered must be numeric");
txtPurchase.Text = "0.0";
txtPurchase.Focus();
}
// end of source code for this method – see next slide

C# Programming: From Problem Analysis to Program Design 58


Adding Button Objects to
TaxApp Form (continued)
btnCompute_Click( ) ( … continued)
inValue = label5.Text; //inValue previously declared as string
Parse( ) used
inValue = inValue.Remove(inValue.Length-1, 1); here as opposed
to TryParse( )
…since value is
percent = double.Parse(inValue) / 100; being retrieve
ans = (purchaseAmt * percent) + purchaseAmt; from TextBox

txtTotalDue.Text = String.Format("{0:C}", ans).ToString();


}
C# Programming: From Problem Analysis to Program Design 59
TaxApp Form

AcceptButton
property on the
form
was set to
btnCompute

Figure 9-15 Tax calculator output


C# Programming: From Problem Analysis to Program Design 60
Practical Tasks
• Write a Windows based application –
elementary calculator
– Result = operand1 operator operand2
• Form Design:
– Labels, text boxes, buttons;
– Two text boxes for input values as operands
– Text box for calculated result
– Buttons for arithmetic operators +, -, *, /, %
Coding Standards
• Guidelines for Naming Controls
– Consistency
– Use appropriate prefix for controls

C# Programming: From Problem Analysis to Program Design 62


Thank You
For
Your Attention!

You might also like