Modul Praktek 2

8/12/2019 Modul Praktek 2

1/26

Contents

Overview 1

Windows Forms Controls by Function 2

Lab Scenario 4

Lab Tasks and Objectives 5

Lab: Configuring Standard Controls 6

Lab Discussion 23

Unit 2: Configuring Standard Controls


2/26

Information in this document, including URL and other Internet Web site references, is subject to

change without notice. Unless otherwise noted, the example companies, organizations, products,

domain names, e-mail addresses, logos, people, places, and events depicted herein are fictitious,

and no association with any real company, organization, product, domain name, e-mail address,

logo, person, place or event is intended or should be inferred. Complying with all applicable

copyright laws is the responsibility of the user. Without limiting the rights under copyright, no

part of this document may be reproduced, stored in or introduced into a retrieval system, or

transmitted in any form or by any means (electronic, mechanical, photocopying, recording, or

otherwise), or for any purpose, without the express written permission of Microsoft Corporation.

The names of manufacturers, products, or URLs are provided for informational purposes only and

Microsoft makes no representations and warranties, either expressed, implied, or statutory,

regarding these manufacturers or the use of the products with any Microsoft technologies. The

inclusion of a manufacturer or product does not imply endorsement of Microsoft of the

manufacturer or product. Links are provided to third party sites. Such sites are not under the

control of Microsoft and Microsoft is not responsible for the contents of any linked site or any link

contained in a linked site, or any changes or updates to such sites. Microsoft is not responsible for

webcasting or any other form of transmission received from any linked site. Microsoft is providing

these links to you only as a convenience, and the inclusion of any link does not imply endorsement

of Microsoft of the site or the products contained therein.

Microsoft may have patents, patent applications, trademarks, copyrights, or other intellectual

property rights covering subject matter in this document. Except as expressly provided in any

written license agreement from Microsoft, the furnishing of this document does not give you anylicense to these patents, trademarks, copyrights, or other intellectual property.

2006 Microsoft Corporation. All rights reserved.

Microsoft, Active Accessibility, Active Directory, BizTalk, Excel, MSDN, PowerPoint,

Visual Basic, Visual C#, Visual Studio, Win32, Windows, Windows CE, Windows NT, and

Windows Server are either registered trademarks or trademarks of Microsoft Corporation in the

United States and/or other countries.

All other trademarks are property of their respective owners.


3/26

Unit 2: Configuring Standard Controls 1

Overview

*****************************ILLEGAL FOR NON-TRAINER USE******************************

IntroductionThis unit introduces many of the controls that you can use from the MicrosoftVisual Studio

Toolbox. It teaches you how to add and configure these controls and explains how you can groupthem into different categories by function.

ObjectivesAfter completing this unit, you will be able to:

Explain the functions of the major categories of Windows Forms controls. Create a form to select and view images by using the SplitContainer, TreeView, PictureBox,

ToolStrip, and other controls.

Create a form to specify report criteria by using the TableLayoutPanel, ListView,MonthCalendar, ComboBox, and other controls.

Create a form to view a Hypertext Markup Language (HTML) Help file by using a WebBrowsercontrol.


4/26

2 Unit 2: Configuring Standard Controls

Windows Forms Controls by Function


You add controls to a form to create the interface of an application. You can then manipulate theproperties, methods, and events of the controls to define their appearance and behavior.

The Visual Studio 2005 Toolbox provides a large number of controls that you can add to forms.The following table describes many of these controls, categorized by function.

Controls that are new to Visual Studio 2005 are in italics.

Function Control Description

TextBox Displays text entered at design time or run time

RichTextBox Enables text to be displayed with formatting

Text edit

MaskedTextBox Constrains the format of user input

Label Displays text that users cannot directly edit

LinkLabel Displays text as a Web-style link to another window or a Web

site

Text display (read-

only)

StatusStrip Displays information about the applications current state by

using a framed window


5/26


(continued)

Function Control Description

CheckListBox Displays a list of items through which users can scroll, each

accompanied by a check box

ComboBox Displays a drop-down list of items

DomainUpDown Displays a list of text items through which users can scroll by

using up and down buttons

ListBox Displays a list of text and graphical items (icons)

ListView Displays items in one of four different views

NumericUpDown Displays a list of numerals through which users can scroll by

using up and down buttons

Selection from a

list

TreeView Displays a hierarchical collection of node objects that can

consist of text with optional check boxes or icons

Graphics display PictureBox Displays graphical files, such as bitmaps and icons, in a frame

Graphics storage ImageList Serves as a repository for images

CheckBox Displays a check box and a label for text

RadioButton Displays a button that can be turned on or off and a label for

text

Value setting

Trackbar Enables users to set values by moving a slider along a scale

DataGridView Displays rows and columns of data in a grid that users can

customize

Content display

WebBrowser Enables the user to browse Web pages inside a form

DateTimePicker Displays a graphical calendar to enable users to select a date or

a time

Date setting

MonthCalendar Displays a graphical calendar to enable users to select a range

of dates

MenuStrip Displays application commands and options that are grouped

by functionality

Menu controls

ContextMenuStrip Displays a shortcut menu when the user right-clicks the

associated control

Button Provides options to start, stop, or interrupt a process

NotifyIcon Displays an icon in the status notification area of the taskbar

that represents an open application

Commands

ToolStrip Provides toolbars and other user interface elements that support

many appearance options

Panel Groups a set of controls on an unlabeled frame through whichusers can scroll

FlowLayoutPanel Arranges controls in a flow layout automatically

GroupBox Groups a set of controls (such as option buttons) in a labeled

frame through which users can scroll

TabControl Provides a tabbed page to organize and enable users to access

grouped objects efficiently

TableLayoutPanel Arranges controls in a table layout automatically

Grouping controlstogether

SplitContainer Provides two panels separated by a movable bar


6/26


7/26


Lab Tasks and Objectives


There are three tasks in this lab. The Resource Toolkit provides resources to help you complete thetasks.

The tasks in this lab are:

Create the EmployeeViewer form. In this task, you will create the EmployeeViewer form and theuser interface for this form. You will add the controls SplitContainer, TreeView, PictureBox,

and ToolStripand set the relevant properties of the form and its controls. The resources for this

task are titled Controls to Use on Windows Forms, How to Load Custom Information into a

TreeView Control, and How to Determine Which TreeNode the User Clicked.

Create the ReportGenerator form. In this task, you will create the ReportGenerator form. You willadd various controls to this form to create the required user interface. These controls include

TableLayoutPanel, ListView, MonthCalendar, ComboBox, and NumericUpDowncontrols.

The resources for this task are titled Controls to Use on Windows Forms and Caching and

Retrieving Information from Controls at Run Time.

Create the ReportGeneratorHelp form. In this task, you will create the ReportGeneratorHelp form.This form will display a static HTML Help file in a WebBrowsercontrol. The resources for this

task are titled Controls to Use on Windows Forms and How to Create an HTML Document

Viewer in a Microsoft Windows Forms Application.

The resource document Lab 2 Screen Shots contains a screen shot of each of the preceding forms.

You can use these screen shots as a visual guide to the design of each form and its controls.


8/26


Lab: Configuring Standard Controls


After completing this lab, you will be able to:

Create a form to select and view images by using the SplitContainer, TreeView, PictureBox,ToolStrip, and other controls.

Create a form to specify report criteria by using the TableLayoutPanel, ListView,MonthCalendar, ComboBox, and other controls.

Create a form to view an HTML Help file by using a WebBrowsercontrol.

Estimated time to complete this lab: 105 minutes

Important You can complete this workshop by using either Microsoft Visual Basicor

Microsoft Visual C#. Code samples and lab solutions are provided in both languages.

Lab SolutionsThere are Visual Basic and Visual C# solution files for the labs in this workshop. You can find thelab solution files in the folder E:\Labfiles\Solution on the virtual machine.

Lab Setup

For this lab, you will use the available MicrosoftVirtual PC environment. Before you begin thelab, you must:

1. Start the Virtual PC environment.

2. Log on to the Virtual PC with the user name Studentand the password Pa$$w0rd.


9/26


Exercise 1Creating the EmployeeViewer FormIn this exercise, you will create a form that displays employees departments and names in aTreeViewcontrol. When the user selects an employee name, a photo of that employee will appearin a PictureBoxcontrol on the form. The form will also contain SplitContainercontrols that

enable the user to resize areas of the form. Other controls added to the form include a ToolStripand a TableLayoutPanel.

ScenarioYou are a developer in the Adventure Works cycle manufacturing company. You have been asked

to assist in the creation of an application that will enable members of the human resourcesdepartment at Adventure Works to view the details of the employees of the company.

Your first task is to create the EmployeeViewer form for the application. You must provide aninterface that enables a user to select an employee from a TreeViewcontrol and view a photo of

that employee on the form.

The high-level tasks for this exercise are:

Create the EmployeeViewer form. Design the interface of the form. Create a method named getDatato load data into the TreeViewcontrol on the form from an .xml

file.

Add code to run the getDatamethod when the Load DataToolStripButtonis clicked. Add code to clear the contents of the form when the Clear DataToolStripButtonis clicked. When an employee is selected in the TreeViewcontrol, add code to display the photo of the

currently selected employee in a PictureBox.

The resource document Lab 2 Screen Shots shows the proposed layout of this form.

Tasks Supporting information

1. Start Visual Studio 2005,

and then open the starter

project.

Open the solution AWEViewerVB.sln, located atE:\Labfiles\Starter\VB\AWEViewerVB, or AWEViewerCS.sln,

located at E:\Labfiles\Starter\CS\AWEViewerCS.

2. Add a new Microsoft

WindowsForm to the

application.

Form name: EmployeeViewer

3. Specify properties for the

EmployeeViewer form.

Specify properties of the form to accomplish the following: The title bar of the form must contain the text Employee Viewer. The form must appear in the center of the screen when opened. The initial size of the form must be 550 pixels wide and 485 pixels

high.


10/26


(continued)


4. Add bitmaps to the project

resources.

Two bitmaps are required for the icons of the ToolStripButtonsthatyou will add to the EmployeeViewer form. Add the files

Database.bmpand RolledBack.bmpto the project resources by using

the following steps:

Display the properties of the project from the Projectmenu. On the Resourcestab, click Add Resource, and then click Add

Existing File.

Browse to E:\Labfiles\Starter. Select the files Database.bmpand RolledBack.bmp, and then

click Open.

Save the project, and then close the Project Properties window.5. Design the EmployeeViewer

form.

a. Add a SplitContainercontrol to the EmployeeViewer form, and then

set properties of the control as follows:

Name: horizontalSplit Orientation:Horizontal

b. Add a second SplitContainercontrol to the upper panel of the first

SplitContainercontrol, and then set properties of the control as

follows:

Name: verticalSplit Orientation: Vertical (default)

c. Add a ToolStripcontrol to the top of the upper-left panel formed by

the SplitContainercontrols. This ToolStripwill display buttons for

loading data into the TreeViewcontrol and for clearing the TreeView

control of data. Set the name of the control as follows:

Name:viewerToolStripd. Add a TreeViewcontrol panel that contains the ToolStripcontrol, and

then set properties of the control as follows:

Name: employeesTreeView Dock: Fill

e. Size the panels of the SplitContainercontrols such that the TreeView

control takes up approximately one quarter of the form.

f. Add a PictureBoxcontrol in the upper-right panel formed by the

SplitContainercontrols, and then set properties of the control as

follows:

Name: employeePictureBox Dock: Fill

g. Size the panels of the SplitContainercontrols such that the

PictureBoxcontrol takes up approximately one quarter of the form.


11/26


(continued)


5. (continued) h. Add a Panelcontrol in the lower-left area of the lower SplitContainer

control. Add a RadioButtoncontrol and a Buttoncontrol to the Panel.

These controls will open a separate form displaying all employee

details. This form will be created in a later phase of development. Set

properties of the controls as follows:

Panel Name: viewAllPanel RadioButton Name: detailsRadioButton RadioButton Text: View All Details Button Name: goButton Button Text: Go

i. Add a TableLayoutPanelcontrol in the lower-right area of the lower

SplitContainercontrol. The controls inside this TableLayoutPanel

will display phone and e-mail details for the employee selected in the

TreeViewcontrol. This functionality will be added in a later phase of

development.

Set the name of the TableLayoutPanelcontrol toviewerTableLayout.

Add a Labelcontrol to the upper-left-hand cell of theTableLayoutPanel. Set properties of the control as follows:

Name: phoneLabel Text: Phone

Add a Label control to the lower-left hand cell of theTableLayoutPanel. Set properties of the control as follows:

Name: emailLabel Text: E-mail

Add a TextBoxcontrol to the upper-right hand cell of theTableLayoutPanel. Set the name of the control as follows:

Name: phoneTextBox Add a TextBoxcontrol to the lower-right hand cell of the

TableLayoutPanel. Set the name of the control as follows:

Name: emailTextBox Set the TableLayoutPanelcolumns to AutoSize.

j. Add a Buttonat the lower-right corner of the form that users can click

to close the form. Set properties of the control as follows:

Name: closeButton Text: Close Form

See the following resources in the Resource Toolkit:

Controls to Use on Windows Forms Lab 2 Screen Shots


12/26


(continued)


6. Configure the ToolStripon

the EmployeeViewer form.

a. Add a ToolStripButtonto the ToolStripcontrol. Set properties of the

control as follows:

Name: loadDataToolStripButton DisplayStyle:ImageAndText Text: Load Data Image: Database.bmp

a.Click the ellipsis button ()on the Imageproperty of theToolStripButton.

b.Click Project resource file.c.Select the file Database.bmp, and then click OK.

b. Add a second ToolStripButtonto the ToolStripControl. Set

properties of the control as follows:

Name: clearDataToolStripButton DisplayStyle:ImageAndText Text: Clear Data Image: RolledBack.bmp

See the resource in the Resource Toolkit, Controls to Use on

Windows Forms.

7. Add an ImageList

component to the


a. Add an ImageListcomponent to the EmployeeViewer form. Thiscomponent will hold the images that are displayed next to the items in

the TreeViewcontrol. Configure the control as follows:

Name: viewerImageList.

Images: OrgChart.bmp, Checkbox.bmp, and user.ico. Thesefiles are located in the folder E:\Labfiles\Starter.

Image Indexpositions: OrgChart.bmp (0), user.ico (1),Checkbox.bmp (2).

TransparentColor: Magenta.b. Set the relevant property of the TreeViewcontrol so that the

ImageListis assigned to the TreeView.


Windows Forms.

8. Create a Clickevent handlerfor the Close Formbutton

on the EmployeeViewer

form.

a. Create a Clickevent handler for the Close Formbutton on theEmployeeViewer form.

b. Add code to the Clickevent handler to close the EmployeeViewer

form when the Close Formbutton is clicked.


13/26


(continued)


9. Add the EmployeeNode

class to the application.

a. Add the existing EmployeeNodeclass to the application. You will use

this class to create derived TreeViewnodes.

In Solution Explorer, right-click the project name, click Add, andthen click Existing Item.

File Location: E:\Labfiles\Starter\CS\EmployeeNode.cs orE:\Labfiles\Starter\VB\EmployeeNode.vb.

b. Examine the contents of the EmployeeNodeclass. This class inherits

from the base TreeNodeclass.

10. Add a reference to the

System.Xmlnamespace.

a. Add a reference to the System.Xmlnamespace in your project if it is

not already referenced. Your code will use this reference when you

create the method to load the contents of an .xml file into the

TreeViewcontrol.

In Solution Explorer, right-click the project name, and then clickAdd Reference.

On the .NETtab, scroll down and select the System.Xmlnamespace, and then click OK.

b. In the Code Editor for the EmployeeViewer form, import the

System.Xmlnamespace at the top of the window.

[Visual Basic]

Imports System.Xml

[C#]

using System.Xml;

11. Add Employees.xmlto the

Supporting Files folder inthe project.

a. Add Employees.xmlto the Supporting Filesfolder. The file is located

in E:\Labfiles\Starter.

b. Open the Employees.xmlfile, and then examine its contents. This file

contains details of employees and their departments.

12. Create a method to load the

contents of Employees.xml

into the TreeViewcontrol

on the EmployeeViewer

form.

a. Add the existing getData method to the Code Editor for the

EmployeeViewer form. You will add two statements to the method to

complete the code.

In the Code Editor window, position the cursor after thecloseButton_Click method and then insert a blank line.

On the Editmenu, click Insert File As Text. Browse to the following location:

E:\Labfiles\Starter\CS\getDataCS.txtor

E:\Labfiles\Starter\VB\getDataVB.txt.

Click Opento insert the contents of the text file.


14/26


(continued)


12. (continued) b. Examine the contents of the getDatamethod. This method carries out

the following actions:

Loops through all of the departments and employees in theEmployees.xml file and adds them to the TreeViewcontrol on the


Uses the EmployeeNodeclass that inherits from the TreeNodeclass.

Displays the image OrgChart.bmp next to the department name inthe TreeViewat all times.

Displays the image User.ico next to the employee name when aname is not selected and the image Checkbox.bmp when a name is

selected.

c. Locate the following comment in the getDatamethod:

TODO Create a new instance of the EmployeeNode class.d. Beneath the comment, add code to carry out the instruction in the

comment, using the variable name of tNode.

e. Locate the following comment in the getDatamethod:

TODO Add the Dept node to the nodes collection of the TreeViewcontrol.

f. Beneath the comment, add code to carry out the instruction in the

comment.

g. Remove the word TODO from the comments.

See the resource in the Resource Toolkit, How to Load Custom

Information into a TreeView Control.

13. Create a Clickevent handler

for the Load Data

ToolStripButton.

a. Create a Clickevent handler for the Load Data ToolStripButton.

b. Add code to the Clickevent handler to do the following:

Check whether any content is currently in the TreeViewcontrol.c. If the TreeViewcontrol does not contain any content, the code must

call the getDatamethod to load data into the TreeView.

14. Create a Clickevent handler

for the Clear Data

ToolStripButton.

a. Create a Clickevent handler for the Clear Data ToolStripButton.

b. Add code to the click event handler to do the following:

Clear the nodes of the TreeViewcontrol. Clear the current image in the PictureBoxcontrol.


Windows Forms.


15/26


(continued)


15. Add the existing files

containing employee photos

to the application.

a. Create a new folder in Solution Explorer at the same level as the

Supporting Files folder.

Folder name: Photos.b. Add the existing bitmap files containing employee photos to the

Photosfolder. These files are located in the folder

E:\Labfiles\Starter\Photos.

16. Create an event handler for

the AfterSelectevent of the

TreeViewcontrol on the


a. Create an event handler for the AfterSelectevent of the TreeView

control.

b. Add code to the AfterSelectevent handler to do the following:

Retrieve the currently selected node in the TreeViewcontrol.c. If a photo exists for the current employee, the code must load the image

into the PictureBoxfrom the Photos folder.

d. If a photo does not exist for the current employee, the code must load

the file NA.bmp into the PictureBoxcontrol.

Tip Use System.IO.File.Exists to determine if a photo exists for

an employee.

See the resource in the Resource Toolkit, How to Determine

Which TreeNode the User Clicked.

17. Add a Buttonto the Main

form to open the


a. Open the Main form.

b. Add a Buttoncontrol to the FlowLayoutPanelon the Main form.

c. Specify properties of this button as follows:

Name: employeeViewerButton

Size: 113, 24(or sized appropriately to fit the FlowLayoutPanel) Text: Employee Viewer

18. Create a Clickevent

handler for the

employeeViewerButton

on the Main form.

a. Create a Clickevent handler for the employeeViewerButton.

b. Add code to the Clickevent handler to open the EmployeeViewer

form.

[Visual Basic]

EmployeeViewer.Show()

[C#]

Form newEmployeeViewer = new EmployeeViewer();

newEmployeeViewer.Show();

Note You can also use the following C# code:

[C#]

newEmployeeViewer().Show();


16/26


(continued)


19. Test the application. a. Run the application. The user name User1and password User1appear

as default values in the Logon form. Click OKto accept the default

values.

b. Click the Employee Viewerbutton on the Main form.

c. Click the Load Databutton to load data into the TreeViewcontrol.

d. Expand the TreeView, and then select an employee name.

e. Check that the form displays a photo of the employee or a blank image

stating that the photo is not available.

f. Test the Clear Databutton.

g. Close the form.

h. Exit the application.

Note The default values for user name and password are provided

to save you time when you test the application.


17/26


Exercise 2Creating the ReportGenerator FormIn this exercise, you will create a form that enables users to select from several different reportcriteria. These criteria will be used in a later phase of development to generate a report.

ScenarioThe members of the human resources department at Adventure Works want to view details abouttheir employees in various ways. You must create a form that will enable the users to select from a

number of predefined criteria. These criteria identify employees who:

Work on a particular shift. Have sick leave greater than or less than a specified number of days. Belong to one or more specified departments. Were hired before or after a specified date.


Create the ReportGenerator form. Design the interface of the form. Add code to store and retrieve the values selected on the ReportGenerator form. Add code to the View Results button to display a MessageBoxthat contains information about the

option and criteria selected on the ReportGenerator form.



1. Add a new Windows Form

to the application.

Add a new Windows Forms to the application. Form name: ReportGenerator

2. Specify properties for the

ReportGenerator form.

Specify properties of the form to accomplish the following: The title bar of the form must contain the text Employees Report

Generator.

The form must appear in the center of the screen when opened. The initial size of the form must be 480 pixels wide and 510 pixels

high.

3. Add the file GoLtr.bmp tothe project resources.

Add the file GoLtr.bmp to the project resources. File Location: E:\Labfiles\Starter


18/26


(continued)


4. Add a ToolStripcontrol to

the ReportGenerator form.

a. Add a ToolStripcontrol to the top of the ReportGenerator form. This

ToolStripwill display a button for viewing the results of the criteria

selected on the form.

ToolStrip Name: reportToolStripb. Add a ToolStripButtonto the ToolStripcontrol.

c. Define properties of the ToolStripButtonas follows:

Name: viewResultsToolStripButton Display Style: Image and Text Image: GoLtr.bmp Text: View Results


Windows Forms.

5. Design the ReportGenerator

form.

a. Add a Labelunderneath the ToolStripcontrol that displays the

following text:

Select one option, fill in the criteria and then click View Resultsb. Add a TableLayoutPanelthat is 430 pixels wide and 390 pixels high

to the ReportGenerator form.

Specify reportTableLayoutas the Nameof theTableLayoutPanel.

Set the CellBorderStyleof the TableLayoutPanelto Outset. Ensure that the control contains three columns and five rows in

total.

Set all of the rows and columns on the TableLayoutPaneltoAutosize.

See the following resources in the Resource Toolkit:

Controls to Use on Windows Forms Lab 2 Screen Shots

Tip You may find it easier to add the controls to the

TableLayoutPanelfirst and then set the size of the rows and

columns.


19/26


(continued)


5. (continued) c. Add the following controls to the TableLayoutPanel:

Row 1: Three Labelcontrols named optionsLabel,operatorsLabeland criteriaLabel, displaying the text Options,

Operators, and Criteria, respectively.

Row 2 Column 1: A RadioButton, namedsickLeaveRadioButton, displaying the text By Sick Leave

(hours).

Row 2 Column 2: A ComboBox, named sickLeaveComboBox,containing the string values =. Ensure that the value


20/26


(continued)


6. Add code to the

ReportGenerator form to

cache the values selected on

the form.

a. Add the contents of the ReportGeneratorProperties text file to the Code

Editor for the ReportGenerator form. You will add two additional

properties to complete the code.

In the Code Editor window, position the cursor in the classdeclaration for the ReportGenerator form.

On the Editmenu, click Insert File As Text. Browse to the following location:

E:\Labfiles\Starter\CS\ReportGeneratorPropertiesCS.txtor

E:\Labfiles\Starter\VB\ReportGeneratorPropertiesVB.txt.

Click Opento insert the contents of the text file.b. Examine the property procedures that you have added to the Code

Editor. These properties are used to cache the values selected on the

ReportGenerator form. In a later phase of development, the stored

values will be retrieved from a separate form.

c. If you are working with C#, add a usingstatement for the namespace

System.Collectionsto the top of the Code Editor for the

ReportGenerator form. Visual Basic imports this namespace globally

by default.

d. Locate the following comment in the Code Editor window:

TODO Create private variables for SickLeave and Shiftproperties.

e. Beneath the comment, add code to carry out the instruction. The

SickLeaveproperty returns an integer value, and the Shiftproperty

returns a string value.

f. Locate the following comment in the Code Editor window:

TODO Create SickLeave public property.g. Beneath the comment, create a public read write property named

SickLeaveto store and retrieve the number of sick leave hours that

were selected in the sickLeaveNumericUpDowncontrol.

h. Locate the following comment in the Code Editor window:

TODO Create Shift public property.i. Beneath the comment, create a public read write property named Shift

to store and retrieve the shift that was selected in the ListViewcontrol.

j. Delete the three TODO comments.

See the resource in the Resource Toolkit, Caching and RetrievingInformation from Controls at Run Time.


21/26


(continued)



the Clickevent of the View

Results ToolStripButton.

a. Create an event handler for the Clickevent of the View Results

ToolStripButton.

b. Position the cursor in the Clickevent handler.

c. Insert the contents of the following file:

E:\Labfiles\Starter\VB\ViewResultsClickEventVB.txtorE:\Labfiles\Starter\CS\ViewResultsClickEventCS.txt.

d. Examine the content of the viewResultsToolStripButton_Clickevent

handler. The purpose of this code is to cache the values selected on the

ReportGenerator form by using the public properties created

previously.

e. Locate the following comments in the Code Editor window:

TODO Add code for Shift option. TODO Add code for SickLeave option.

f. Beneath each comment, add code to carry out the instruction in the

comment. Your code must accomplish the following:

Cache the option selected on the ReportGenerator form by usingthe SelectedOptionproperty.

For the SickLeaveoption, the SelectedOptionproperty mustindicate whether the Less Thanor Greater Thanoption was

selected in the ComboBox.

Check the values of the criteria for the option that is selected. Cache these values by using the relevant Shiftor SickLeave

property.

Display a message box that contains information about the selectedoption and the criteria values that the user has chosen.

g. Delete the two TODO comments.

See the resource in the Resource Toolkit, Caching and Retrieving

Information from Controls at Run Time.

8. Add a Buttonto the Main

form to open the


a. Open the Main form.

b. Add a Buttoncontrol to the FlowLayoutPanelon the Main form.

c. Specify properties of this button as follows:

Name: reportGeneratorButton Size: 113, 24(or sized appropriately to fit the FlowLayoutPanel) Text:Report Generator

9. Create a Clickevent

handler for the

reportGeneratorButton

on the Main form.

a. Create a Clickevent handler for the reportGeneratorButtonon the

Main form.

b. Add code to the Clickevent handler to open the ReportGenerator form.


22/26


(continued)


10. Test the application. a. Run the application.

b. The user name User1and password User1appear as default values inthe Logon form. Click OKto accept the default values.

c. Click Report Generatoron the Main form.

d. Select one of the options on the ReportGenerator form, and then choose

criteria for the option.

e. Click View Results, and then check that the information in the

MessageBoxis correct.

f. Select each of the options in turn, and then check that the MessageBox

displays correctly for each one.

g. Close the ReportGenerator form.

h. Exit the application.


23/26


Exercise 3Creating the ReportGeneratorHelp FormIn this exercise, you will create a form that displays a static HTML Help file in a WebBrowsercontrol.

ScenarioUsers of the AWEViewer application require a Help file that explains how to use the ReportGenerator form. This Help file must be easily accessible from the ReportGenerator form.


Create a new form named ReportGeneratorHelp. Add a WebBrowsercontrol to the new form. Load the file HelpFile.htm into the WebBrowsercontrol when the ReportGeneratorHelp form

loads.

Add a ToolStripButtonto the ToolStripcontrol on the ReportGenerator form that will be used toopen the ReportGeneratorHelp form.



1. Add HelpFile.htm to the

Supporting Files folder in

the project.

a. Add HelpFile.htmto the Supporting Filesfolder. The file is located

in E:\Labfiles\Starter.

b. Open the HelpFile.htmfile, and then examine its contents.

2. Add the file Help.bmp to the

project resources.

Add the file Help.bmpto the project resources. You will use thisbitmap as the icon for the Help ToolStripButtonon the


File Location: E:\Labfiles\Starter3. Add a new Windows Form

to the application.

Add a new Windows Form to the application. Form name: ReportGeneratorHelp

4. Specify properties of the

ReportGeneratorHelp form.

Specify properties of the ReportGeneratorHelp form to accomplish thefollowing:

The title bar of the form must contain the text Report GeneratorHelp.

The form must appear in the center of the screen when opened. The initial size of the form must be 530 pixels wide and 450 pixels

high.


24/26


(continued)


5. Add a WebBrowsercontrol

to the form.

Add a WebBrowsercontrol to the form. Set properties of the controlas follows:

Name: helpWebBrowser Dock: Fill


Windows Forms.


the Loadevent of the


a. Create a Loadevent handler for the ReportGeneratorHelp form.

b. Add code to the Loadevent handler to accomplish the following:

Set the urlproperty of the helpWebBrowsercontrol to the fileHelpFile.htmin the Supporting Filesfolder.

See the resource in the Resource Toolkit, How to Create an

HTML Document Viewer in a Microsoft Windows FormsApplication.

7. Add a Help

ToolStripButtonto the

ToolStripcontrol on the


Add a ToolStripButtonto the ToolStripcontrol on theReportGenaratorform. Set properties of the control as follows:

Name: helpToolStripButton Image: Help.bmp ToolTipText: Help Display Style: Image


Windows Forms.


the Clickevent of the Help

ToolStripButton.

a. Create a Clickevent handler for the helpToolStripButton.

b. Add code to the Clickevent handler to display the


9. Test the application. a. Run the application.

b. The user name User1and the password User1appear as default values

in the Logon form. Click OKto accept the default values.

c. Click Report Generatoron the Main form to open the


d. Click Helpon the ReportGenerator form to display the


e. Close all the open forms and end the application.

Lab ShutdownAfter you complete the lab, you must shut down the Virtual PC and discard any changes.


25/26


Lab Discussion


In this lab, you created three forms that contain a number of different standard controls. Work withthe class to compare the approaches you took when you completed the lab. Use the following

questions to help direct your discussion:

How did you complete the getDatamethod used to load data into the TreeViewcontrol on theEmployeeViewer form?

Discuss the code for the getDatamethod. How does this method incorporate the EmployeeNode

class?

How did you implement the handler for the AfterSelectevent of the TreeViewcontrol?Discuss the solution that you have created to display the photograph of the currently selected

employee in the TreeViewcontrol. What code did you use to display the image NA.bmp when a

photograph is not available for a particular employee?

How did you configure the TableLayoutPanelin the ReportGenerator form?Discuss the method that you used to design the user interface of the ReportGenerator form.

Did you make use of the Visual Studio 2005 Image Library?The bitmaps that you used as ToolStripButtonimages in this lab are from the VisualStudio 2005 Image Library. This is a large library of artwork provided with Visual Studio. It

is located in the folder \Microsoft Visual Studio 8\Common7\VS2005ImageLibrary.


26/26

THIS PAGE INTENTIONALLY LEFT BLANK

Documents

Modul Praktek 2