chapter 3 introduction to event handling and windows forms applications
TRANSCRIPT
![Page 1: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/1.jpg)
Chapter 3
Introduction to Event Handling and Windows Forms Applications
![Page 2: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/2.jpg)
Class 3: Windows Form Applications
• Procedural and Event-driven Applications
• Design Issues
• Visual Development
• Event Handling
![Page 3: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/3.jpg)
Comparing Command-line and Form-based Interfaces
• User interfaces can be roughly categorized into two types– Command-line interfaces use textual input and
output• The end user interacts with an application by typing
commands
– Most Windows user interfaces are form-based visual interfaces
• The end user interacts with an application through its visual elements
![Page 4: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/4.jpg)
Differences Between Console and Windows Application Projects
• Console projects are procedural
• Console projects have a textual (character-based) user interface
• Windows Application projects are event driven
• Windows Application projects have a visual user interface consisting of buttons and boxes
![Page 5: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/5.jpg)
Figure 3-1: Comparing a Command-line Interface and a Form-based Interface
![Page 6: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/6.jpg)
Principles of a User Interface
• Control – The end user should control the application
• User-friendliness – The interface should help the end user accomplish tasks
• Intuitiveness – The interface should follow a direct style that proceeds logically
• Consistency – The user interface should have consistent fonts, and buttons should have the same shape and size
• Feedback – The interface should provide clear and immediate feedback
![Page 7: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/7.jpg)
Principles of a User Interface (continued)
• Graphics – Avoid the use of unnecessary graphics
• Input – Minimize transitions between the keyboard and mouse where possible
• Screen resolution – The user interface should adapt to different screen resolutions– Users may be visually impaired, requiring
larger fonts
![Page 8: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/8.jpg)
Designing a User Interface
• A user interface should be designed before it is implemented– Design the user interface using a tool such as
Visio– A simple pencil and paper sketch will often do
![Page 9: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/9.jpg)
Figure 3-2: Designing a User Interface
![Page 10: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/10.jpg)
Principles of Control Design
• Alignment – Align control instances vertically or horizontally
• Balance – Distribute control instances evenly about the form
• Color – Use soft colors with adequate contrast between foreground and background colors– Users may be colorblind
• Function grouping – Group control instances based on their function
• Consisting sizing – Control instances should have the same size
![Page 11: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/11.jpg)
Figure 3-3: A Poor User Interface
![Page 12: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/12.jpg)
Figure 3-4:An Improved User Interface
![Page 13: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/13.jpg)
Creating a Windows Application Project
• The steps to create a Console Application project and Windows Application project are nearly the same
• Use the New Project Dialog box– Use the Windows Application template
• The templates vary based on the Visual Studio edition
– Assign a name to the solution, as necessary
![Page 14: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/14.jpg)
The Solution Explorer
• The role of the Solution Explorer is the same for Console and Windows Application projects– It organizes the various parts of a solution
• The project and support files are the same
• The role of project references is the same– However, Windows Application projects reference
different assemblies and namespaces
• Form files appear instead of module files
![Page 15: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/15.jpg)
The Toolbox and Windows Forms Designer
• The Toolbox and Windows Forms Designer are used together to create an application’s visual interface
• The Toolbox contains controls• Controls created on a form are called control
instances• View the Windows Forms Designer by
– Selecting the form in the Solution Explorer and clicking View Designer
– Clicking View, Designer on the menu bar
![Page 16: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/16.jpg)
Characteristics of a Form
• A title bar appears along the top of a form• An optional control box appears in the title bar
– The control box contains Minimize, Maximize, Restore, and Close buttons
– The buttons on the control box may be disabled or hidden
• An icon appears on the left side of the title bar• Below the title bar appears an optional menu• The region inside a form's border is called the client
area
![Page 17: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/17.jpg)
Figure 3-8: The Organization
of Controls in the Toolbox
![Page 18: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/18.jpg)
Figure 3-9: The Properties Window
![Page 19: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/19.jpg)
Configuring Textual and Hierarchical Properties
• Properties such as Name and Text store textual values– Edit these values directly in the Value column
• A plus or minus sign appears next to hierarchical properties– Click plus to expand and minus to collapse
• Some properties display a drop-down list
• Some properties display a visual editor
![Page 20: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/20.jpg)
Figure 3-14: Visual Editor for the TextAlign Property
![Page 21: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/21.jpg)
Using Visual Studio to Create and Configure Control Instances
• To create a control instance– Click the control in the Toolbox to select it– Using the mouse, draw the region of the control
instance on the form
• To delete a control instance, click the control instance to select it and press Delete
![Page 22: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/22.jpg)
Moving and Resizing a Control Instance
• Move a control instance by dragging it on the form
• Resize a control instance by– Clicking the control instance to select it– Resize the control instance by dragging the
sizing handles
![Page 23: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/23.jpg)
Working with Multiple Control Instances
• Select multiple control instances by– Holding down the Shift key and clicking the
desired control instance– Dragging a rectangle around the desired control
instance with the Pointer tool• Only part of the control instance needs to appear in the
rectangle to be selected
![Page 24: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/24.jpg)
Introduction to Visual Studio Controls
• Controls discussed in this chapter– The PictureBox displays graphical images– The Label control displays text– The Button control is used to perform a specific
task when clicked– The OpenFileDialog control displays a
dialog box from which the end user can select a file to open
– The ToolTip control displays informational pop-up messages
![Page 25: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/25.jpg)
Understanding the Name Property
• Every form and control instance has a name– Visual Studio assigns a default name to forms and
control instances
• The value of the Name property is used to reference a form or control instance programmatically
• Assigning meaningful names creates more readable code– Use consistent prefixes for form and control instance
names
![Page 26: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/26.jpg)
Control Prefixes
Control Prefix
Button btn
Label lbl
OpenFileDialog ofd
PictureBox pic
ToolTip tip
![Page 27: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/27.jpg)
The OpenFileDialog Control
• The CommonDialog class is the base class for other classes– These classes are used to display standard dialog boxes
• The OpenFileDialog control allows the end user to select a file to open
• The control instance appears in a resizable tray below the Windows Forms Designer at design time
• Call the ShowDialog method to display the control instance
![Page 28: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/28.jpg)
Figure 3-20:Open Dialog Box
![Page 29: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/29.jpg)
Using the OpenFileDialog Control
• The ShowDialog method displays the dialog box to the end user
• The FileName property contains the file name selected by the end user– The OpenFileDialog control does not
actually open a file
![Page 30: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/30.jpg)
ToolTips (Introduction)
• ToolTips appear as pop-up windows when the mouse hovers over a control instance– Use to display informational messages to the end
user
• Create ToolTips with the ToolTip control– The ToolTip control is a provider control,
meaning that it works with other control instances– Use one ToolTip control instance for all the
other control instances on a form
![Page 31: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/31.jpg)
Creating Code for a Windows Application Project
• Code executes as the end user interacts with the form’s control instances– This code is called the code behind the form
• The code behind the form is made up of two parts– One part is automatically generated by the
Windows Forms Designer– The second part contains the code you write
![Page 32: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/32.jpg)
Introduction to Class Blocks and Partial Classes
• A form is made up of two files– The Windows Forms Designer generated code
appears in the file named frmName.Designer.vb– Developer created code appears in the file
frmName.vb– A form is a class having the following structure
Public Class frmMain
‘ statements
End Class
![Page 33: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/33.jpg)
The Syntax of a Class Block
• Class blocks and Module blocks have a similar syntax– The Class and End Class keywords mark
the beginning and end of a Class block– A Class block contains procedures
• The procedure named New is the entry point, and is called the constructor
• A Class block can contain a Main() procedure, but it is not the entry point
![Page 34: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/34.jpg)
Introduction to Partial Classes
• A partial class is a class whose code appears in multiple files– Visual Studio uses partial classes to store
automatically generated code– Multiple developers can use partial classes to
create code independently
![Page 35: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/35.jpg)
Figure 3-25:Windows Forms Designer Generated Code
![Page 36: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/36.jpg)
Introduction to Event Handlers
• An event hander is a procedure containing statements that execute when the end user performs an action– Windows executes different event handlers as
different events fire– Windows fires a Click event when the end user
clicks a button– Different types of controls support different
events
![Page 37: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/37.jpg)
Figure 3-26: Executing an Event Handler
![Page 38: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/38.jpg)
Characteristics of an Event Handler
• An event handler is a form of Sub procedure• All event procedures have two arguments
– Arguments send information to a procedure
• The Handles clause marks the procedure as an event handler
• Use the Windows Forms Designer and Code Editor to create event handlers automatically– Double-click the control instance in the Windows Forms
Designer– Use the Class Name and Method Name Combo Boxes to
create and select event handlers
![Page 39: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/39.jpg)
Assignment Statements (Introduction)
• Assignment statements are similar to algebraic statements– They contain a left side and a right side– An equals (=) sign separates the left side and
the right side– The expression on the left side is evaluated and
stored in the property appearing on the right side
![Page 40: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/40.jpg)
Assignment Statements (Example 1)
• Store a literal value in the form’s Text property– String literal values are surrounded by double
quotation marks– Me.Text is the form’s Text property
Me.Text = "Chapter 3"
![Page 41: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/41.jpg)
Assignment Statements (Example 2)
• Assignment statements can be used with numeric values
• Double quotation marks do not surround literal values
• Store 0 in the Top and Left properties of a PictureBox control instance named picCurrent
picCurrent.Top = 0
picCurrent.Left = 0
![Page 42: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/42.jpg)
Assignment Statements (Example 3)
• Boolean values can be used in assignment statement– True and False are Boolean values
– The Visible and Enabled properties store Boolean values
• Set the Visible and Enabled properties for control instances
btnDemo.Visible = True
picCurrent.Enabled = False
![Page 43: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/43.jpg)
Reading an Image
• Call the FromFile method of the System.Drawing.Image class
• The method accepts a file name as the argument
![Page 44: Chapter 3 Introduction to Event Handling and Windows Forms Applications](https://reader035.vdocuments.us/reader035/viewer/2022062216/56649dc75503460f94abbc36/html5/thumbnails/44.jpg)
Reading an Image (Example)
• Read the Image named "C:\House1.jpg" into the PictureBox control instance named picDemopicDemo.Image = _
System.Drawing.Image.FromFile( _
"C:\House1.jpg")