1 14 Graphical User Interface Concepts Part 2

  • Slides: 129
Download presentation
1 14 Graphical User Interface Concepts: Part 2 2006 Pearson Education, Inc. All rights

1 14 Graphical User Interface Concepts: Part 2 2006 Pearson Education, Inc. All rights reserved.

2 I claim not to have controlled events, but confess plainly that events have

2 I claim not to have controlled events, but confess plainly that events have controlled me. — Abraham Lincoln Capture its reality in paint! — Paul Cézanne An actor entering through the door, you’ve got nothing. But if he enters through the window, you’ve got a situation. — Billy Wilder 2006 Pearson Education, Inc. All rights reserved.

3 But, soft! what light through yonder window breaks? It is the east, and

3 But, soft! what light through yonder window breaks? It is the east, and Juliet is the sun! — William Shakespeare 2006 Pearson Education, Inc. All rights reserved.

4 OBJECTIVES In this chapter you will learn: § To create menus, tabbed windows

4 OBJECTIVES In this chapter you will learn: § To create menus, tabbed windows and multiple document interface (MDI) programs. § To use the List. View and Tree. View controls for displaying information. § To create hyperlinks using the Link. Label control. § To display lists of information in List. Box and Combo. Box controls. § To input date and time data with the Date. Time. Picker. § To create custom controls. 2006 Pearson Education, Inc. All rights reserved.

5 14. 1 Introduction 14. 2 Menus 14. 3 Month. Calendar 14. 4 Date.

5 14. 1 Introduction 14. 2 Menus 14. 3 Month. Calendar 14. 4 Date. Time. Picker 14. 5 Link. Label 14. 6 List. Box 14. 7 Checked. List. Box 14. 8 Combo. Box Control 14. 9 Tree. View Control 14. 10 List. View Control 14. 11 Tab. Control Control 14. 12 Multiple Document Interface (MDI) Windows 14. 13 Visual Inheritance 14. 14 User-Defined Controls 14. 15 Wrap-Up 2006 Pearson Education, Inc. All rights reserved.

6 14. 1 Introduction • Continue study of GUIs – Menus • Logically organized

6 14. 1 Introduction • Continue study of GUIs – Menus • Logically organized commands – Link. Labels • Enable user to visit one of several destinations – List. Box – Combo. Boxes – Tree. View • Display data hierarchically – Tab. Control – MDI windows • Multiple document interface 2006 Pearson Education, Inc. All rights reserved.

7 14. 2 Menus • Menus – Groups of related commands for Windows applications

7 14. 2 Menus • Menus – Groups of related commands for Windows applications – Integral part of GUIs • Organize commands without “cluttering” the GUI – All menu items can have access shortcuts or hotkeys • Type an ampersand (&) before the character to be underlined • Set the Shortcut. Keys property of the appropriate Tool. Strip. Menu. Items – Non-top-level menus can also have shortcut keys – Menu items can display check marks • Indicates that multiple options on the menu can be selected at once 2006 Pearson Education, Inc. All rights reserved.

8 Submenu Menu Shortcut key Menu items Disabled command Checked menu item Seperator bar

8 Submenu Menu Shortcut key Menu items Disabled command Checked menu item Seperator bar Fig. 14. 1 | Menus, submenus and menu items 2006 Pearson Education, Inc. All rights reserved.

9 Type menu name in Text. Box Main menu bar Menu. Strip icon Fig.

9 Type menu name in Text. Box Main menu bar Menu. Strip icon Fig. 14. 2 | Editing menus in Visual Studio. 2006 Pearson Education, Inc. All rights reserved.

10 Place & character before a letter to underline it in the menu, so

10 Place & character before a letter to underline it in the menu, so the character can be used as an access shortcut Text. Boxes for adding items to the menu Fig. 14. 3 | Adding Tool. Strip. Menu. Items to a Menu. Strip. 2006 Pearson Education, Inc. All rights reserved.

11 Look-and-Feel Observation 14. 1 Buttons can have access shortcuts. Place the & symbol

11 Look-and-Feel Observation 14. 1 Buttons can have access shortcuts. Place the & symbol immediately before the desired character in the Button’s label. To press the button by using its access key in the running application, the user presses Alt and the underlined character. 2006 Pearson Education, Inc. All rights reserved.

12 Setting modifier keys Select key (modifier and key combination specifies the shortcut key

12 Setting modifier keys Select key (modifier and key combination specifies the shortcut key for the menu item) Fig. 14. 4 | Setting a menu item’s shortcut keys. 2006 Pearson Education, Inc. All rights reserved.

13 Menu item options Fig. 14. 5 | Menu item options. 2006 Pearson Education,

13 Menu item options Fig. 14. 5 | Menu item options. 2006 Pearson Education, Inc. All rights reserved.

14 Fig. 14. 6 | Menu. Strip and Tool. Strip. Menu. Item properties and

14 Fig. 14. 6 | Menu. Strip and Tool. Strip. Menu. Item properties and an event. (Part 1 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

15 Fig. 14. 6 | Menu. Strip and Tool. Strip. Menu. Item properties and

15 Fig. 14. 6 | Menu. Strip and Tool. Strip. Menu. Item properties and an event. (Part 2 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

16 Look-and-Feel Observation 14. 2 It is a convention to place an ellipsis (

16 Look-and-Feel Observation 14. 2 It is a convention to place an ellipsis ( ) after the name of a menu item that when selected, displays a dialog (e. g. Save As. . . ). Menu items that produce an immediate action without prompting the user for more information (e. g. Save) should not have an ellipsis following their name. 2006 Pearson Education, Inc. All rights reserved.

Outline 17 Menu. Test. Form. cs (1 of 8) Event handler for about. Tool.

Outline 17 Menu. Test. Form. cs (1 of 8) Event handler for about. Tool. Strip. Menu. Item for when it is selected Provide information through a Message. Box Event handler for exit. Tool. Strip. Menu. Item for when it is selected Terminates program 2006 Pearson Education, Inc. All rights reserved.

Outline Clears all checkmarks next to the menu items 18 Menu. Test. Form. cs

Outline Clears all checkmarks next to the menu items 18 Menu. Test. Form. cs (2 of 8) Change the color and check the corresponding menu item 2006 Pearson Education, Inc. All rights reserved.

Outline 19 Menu. Test. Form. cs Change the color and check (3 theof 8)

Outline 19 Menu. Test. Form. cs Change the color and check (3 theof 8) corresponding menu item Change the color and check the corresponding menu item 2006 Pearson Education, Inc. All rights reserved.

Outline 20 Menu. Test. Form. cs Change the color and check (4 the of

Outline 20 Menu. Test. Form. cs Change the color and check (4 the of 8) corresponding menu item Clears all checkmarks next to the menu items 2006 Pearson Education, Inc. All rights reserved.

Outline 21 Menu. Test. Form. cs Change the font style and check (5 of

Outline 21 Menu. Test. Form. cs Change the font style and check (5 of 8) the corresponding menu item Change the font style and check the corresponding menu item 2006 Pearson Education, Inc. All rights reserved.

Outline 22 Menu. Test. Form. cs Change the font style and (6 check of

Outline 22 Menu. Test. Form. cs Change the font style and (6 check of 8) the corresponding menu item Bold the current font style if it is not already; else, un-bold it 2006 Pearson Education, Inc. All rights reserved.

Outline 23 Menu. Test. Form. cs (7 of 8) Italicize the current font style

Outline 23 Menu. Test. Form. cs (7 of 8) Italicize the current font style if it is not already; else, un-italicize it (a) (b) 2006 Pearson Education, Inc. All rights reserved.

(c) Outline (d) 24 Menu. Test. Form. cs (8 of 8) (e) (f) 2006

(c) Outline (d) 24 Menu. Test. Form. cs (8 of 8) (e) (f) 2006 Pearson Education, Inc. All rights reserved.

25 Software Engineering Observation 14. 1 The mutual exclusion of menu items is not

25 Software Engineering Observation 14. 1 The mutual exclusion of menu items is not enforced by the Menu. Strip, even when the Checked property is true. You must program this behavior. 2006 Pearson Education, Inc. All rights reserved.

26 14. 3 Month. Calendar Control • The. NET Framework provides two controls that

26 14. 3 Month. Calendar Control • The. NET Framework provides two controls that allow an application to retrieve date and time information – Month. Calendar • Displays a monthly calendar on the Form • The default event for this control is Date. Changed – Generated when a new date is selected – Date. Time. Picker (Section 14. 4) 2006 Pearson Education, Inc. All rights reserved.

27 Current day is outlined Selected day is highlighted Fig. 14. 8 | Month.

27 Current day is outlined Selected day is highlighted Fig. 14. 8 | Month. Calendar control. 2006 Pearson Education, Inc. All rights reserved.

28 Fig. 14. 9 | Month. Calendar properties and an event. 2006 Pearson Education,

28 Fig. 14. 9 | Month. Calendar properties and an event. 2006 Pearson Education, Inc. All rights reserved.

29 14. 4 Date. Time. Picker Control • Date. Time. Picker – Displays the

29 14. 4 Date. Time. Picker Control • Date. Time. Picker – Displays the calendar when a down arrow is selected – Retrieve date and time information from user – More customizable than a Month. Calendar • More properties are provided to edit the look and feel of the drop-down calendar – Value. Changed event • Occurs when user selects a date 2006 Pearson Education, Inc. All rights reserved.

30 Fig. 14. 10 | Date. Time. Picker properties and an event. (Part 1

30 Fig. 14. 10 | Date. Time. Picker properties and an event. (Part 1 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

31 Fig. 14. 10 | Date. Time. Picker properties and an event. (Part 2

31 Fig. 14. 10 | Date. Time. Picker properties and an event. (Part 2 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

Outline 32 Date. Time. Picker. Form. cs (1 of 3) Retrieve the date selected

Outline 32 Date. Time. Picker. Form. cs (1 of 3) Retrieve the date selected by the user Update output. Label: Print the 3 rd day after user’s selected date Update output. Label: Print the 2 nd 2006 Pearson Education, day after user’s selected date Inc. All rights reserved.

Outline The “minimum” date that can be selected is “today” 33 Date. Time. Picker.

Outline The “minimum” date that can be selected is “today” 33 Date. Time. Picker. Form. cs (2 ofdate 3) that can be The “maximum” selected is a year from “today” (a) (b) 2006 Pearson Education, Inc. All rights reserved.

Outline (c) (d) 34 Date. Time. Picker. Form. cs (3 of 3) 2006 Pearson

Outline (c) (d) 34 Date. Time. Picker. Form. cs (3 of 3) 2006 Pearson Education, Inc. All rights reserved.

35 14. 5 Link. Label Control • Link. Label – Displays links to other

35 14. 5 Link. Label Control • Link. Label – Displays links to other resources • Ex: files or Web pages – Link. Clicked event • Generated when Link. Label clicked – Class Link. Label is derived from class Label • Inherits all of class Label’s functionality Note: @ symbol before a string indicates that all characters should be interpreted literally • Class Process – Method Start • Allows you to execute other programs from an application 2006 Pearson Education, Inc. All rights reserved.

36 Look-and-Feel Observation 14. 3 A Link. Label is the preferred control for indicating

36 Look-and-Feel Observation 14. 3 A Link. Label is the preferred control for indicating that the user can click a link to jump to a resource such as a Web page, though other controls can perform similar tasks. 2006 Pearson Education, Inc. All rights reserved.

37 Link. Label on a Form Hand image displays when mouse moves over Link.

37 Link. Label on a Form Hand image displays when mouse moves over Link. Label Fig. 14. 12 | Link. Label control in running program. 2006 Pearson Education, Inc. All rights reserved.

38 Fig. 14. 13 | Link. Label properties and an event. (Part 1 of

38 Fig. 14. 13 | Link. Label properties and an event. (Part 1 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

39 Fig. 14. 13 | Link. Label properties and an event. (Part 2 of

39 Fig. 14. 13 | Link. Label properties and an event. (Part 2 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

Outline 40 Link. Label. Test. Form. cs (1 of 4) Change the color of

Outline 40 Link. Label. Test. Form. cs (1 of 4) Change the color of the link to show that it has already been clicked before Open the C: folder 2006 Pearson Education, Inc. All rights reserved.

Outline Change the color of the link to show that it has already been

Outline Change the color of the link to show that it has already been clicked before 41 Link. Label. Test. Form. cs (2 of 4) Open Internet Explorer and visit the site Change the color of the link to show that it has already been clicked before Open new document in Note. Pad 2006 Pearson Education, Inc. All rights reserved.

Outline 42 Link. Label. Test. Form. cs Click first Link. Label to look at

Outline 42 Link. Label. Test. Form. cs Click first Link. Label to look at contents of C: drive (3 of 4) 2006 Pearson Education, Inc. All rights reserved.

Outline 43 Click second Linklabel to go to Deitel Web site Link. Label. Test.

Outline 43 Click second Linklabel to go to Deitel Web site Link. Label. Test. Form. cs (4 of 4) Click on third Linklabel to open Notepad 2006 Pearson Education, Inc. All rights reserved.

44 14. 6 List. Box Control • List. Box – Allows user to view

44 14. 6 List. Box Control • List. Box – Allows user to view and select from multiple items in a list – Static GUI entities – To add and remove items • Call the Add method • Call the Add. Range method – Add an array of objects • Call the Remove. At method • Call the Clear method – Remove all entries • Use the String Collection Editor 2006 Pearson Education, Inc. All rights reserved.

45 List. Box Selected items Scrollbars appear if necessary Checked item Checked. List. Box

45 List. Box Selected items Scrollbars appear if necessary Checked item Checked. List. Box Fig. 14. 15 | List. Box and Checked. List. Box on a Form. 2006 Pearson Education, Inc. All rights reserved.

46 Fig. 14. 16 | List. Box properties, methods and an event. (Part 1

46 Fig. 14. 16 | List. Box properties, methods and an event. (Part 1 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

47 Fig. 14. 16 | List. Box properties, methods and an event. (Part 2

47 Fig. 14. 16 | List. Box properties, methods and an event. (Part 2 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

48 Fig. 14. 17 | String Collection Editor. 2006 Pearson Education, Inc. All rights

48 Fig. 14. 17 | String Collection Editor. 2006 Pearson Education, Inc. All rights reserved.

Outline 49 List. Box. Test. Form. cs (1 of 3) Add user’s input as

Outline 49 List. Box. Test. Form. cs (1 of 3) Add user’s input as a new element of display. List. Box 2006 Pearson Education, Inc. All rights reserved.

Outline 50 Remove the selected element from display. List. Box. Test. Form. cs (2

Outline 50 Remove the selected element from display. List. Box. Test. Form. cs (2 of 3) Remove every element from display. List. Box Terminate program 2006 Pearson Education, Inc. All rights reserved.

(a) (b) Outline 51 List. Box. Test. Form. cs (3 of 3) (c) (d)

(a) (b) Outline 51 List. Box. Test. Form. cs (3 of 3) (c) (d) 2006 Pearson Education, Inc. All rights reserved.

52 14. 7 Check. List. Box Control • Check. List. Boxes – – Extend

52 14. 7 Check. List. Box Control • Check. List. Boxes – – Extend List. Box Include Check. Boxes next to each item in the list Multiple items can be selected Selection. Mode property • Only possible values are None and One – Give the user multiple selection or no selection at all • Behavior consistent with that of Check. Boxes – Event Item. Check • Occurs whenever a user checks or unchecks a Checked. List. Box item 2006 Pearson Education, Inc. All rights reserved.

53 Common Programming Error 14. 1 The IDE displays an error message if you

53 Common Programming Error 14. 1 The IDE displays an error message if you attempt to set the Selection. Mode property to Multi. Simple or Multi. Extended in the Properties window of a Checked. List. Box. If this value is set programmatically, a runtime error occurs. 2006 Pearson Education, Inc. All rights reserved.

54 Fig. 14. 19 | Checked. List. Box properties, methods and events. (Part 1

54 Fig. 14. 19 | Checked. List. Box properties, methods and events. (Part 1 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

55 Fig. 14. 19 | Checked. List. Box properties, methods and events. (Part 2

55 Fig. 14. 19 | Checked. List. Box properties, methods and events. (Part 2 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

Outline 56 Checked. List. Box. Test Form. cs (1 of 3) Retrieve the selected

Outline 56 Checked. List. Box. Test Form. cs (1 of 3) Retrieve the selected element as a string Add the retrieved element to display. List. Box Remove the retrieved element to display. List. Box 2006 Pearson Education, Inc. All rights reserved.

(a) Outline 57 Checked. List. Box. Test Form. cs (2 of 3) (b) 2006

(a) Outline 57 Checked. List. Box. Test Form. cs (2 of 3) (b) 2006 Pearson Education, Inc. All rights reserved.

Outline 58 (c) Checked. List. Box. Test Form. cs (3 of 3) (d) 2006

Outline 58 (c) Checked. List. Box. Test Form. cs (3 of 3) (d) 2006 Pearson Education, Inc. All rights reserved.

59 14. 8 Combo. Box Control • Combo. Box – – Combines Text. Box

59 14. 8 Combo. Box Control • Combo. Box – – Combines Text. Box features with a drop-down list Contains a list from which a value can be selected User can enter text into the Text. Box User can click the down arrow to select from a list of predefined items 2006 Pearson Education, Inc. All rights reserved.

60 Click the down arrow to display items in drop-down list Selecting an item

60 Click the down arrow to display items in drop-down list Selecting an item from drop-down list changes text in Text. Box portion Fig. 14. 21 | Combo. Box demonstration. 2006 Pearson Education, Inc. All rights reserved.

61 Look-and-Feel Observation 14. 4 Use a Combo. Box to save space on a

61 Look-and-Feel Observation 14. 4 Use a Combo. Box to save space on a GUI. A disadvantage is that, unlike with a List. Box, the user cannot see available items without expanding the drop-down list. 2006 Pearson Education, Inc. All rights reserved.

62 Fig. 14. 22 | Combo. Box properties and an event. (Part 1 of

62 Fig. 14. 22 | Combo. Box properties and an event. (Part 1 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

63 Fig. 14. 22 | Combo. Box properties and an event. (Part 2 of

63 Fig. 14. 22 | Combo. Box properties and an event. (Part 2 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

Outline 64 combo. Box. Text. Form. Cs (1 of 3) Create all the necessary

Outline 64 combo. Box. Text. Form. Cs (1 of 3) Create all the necessary objects for drawing 2006 Pearson Education, Inc. All rights reserved.

Outline Property that returns the index of the selected element 65 combo. Box. Text.

Outline Property that returns the index of the selected element 65 combo. Box. Text. Form. Cs Chooses and draw the (2 of 3) appropriate shape based on the user’s selection 2006 Pearson Education, Inc. All rights reserved.

Outline (a) 66 (b) combo. Box. Text. Form. Cs (3 of 3) (c) (d)

Outline (a) 66 (b) combo. Box. Text. Form. Cs (3 of 3) (c) (d) 2006 Pearson Education, Inc. All rights reserved.

67 Look-and-Feel Observation 14. 5 Make lists (such as Combo. Boxes) editable only if

67 Look-and-Feel Observation 14. 5 Make lists (such as Combo. Boxes) editable only if the program is designed to accept user-submitted elements. Otherwise, the user might try to enter a custom item that is improper for the purposes of your application. 2006 Pearson Education, Inc. All rights reserved.

68 14. 9 Tree. View Control • Tree. View – Displays nodes hierarchically in

68 14. 9 Tree. View Control • Tree. View – Displays nodes hierarchically in a tree • Nodes are objects that contain values and can refer to other nodes – A parent node contains child nodes – Child nodes can be parents to other nodes – Child nodes with the same parent node are considered sibling nodes • A tree is a collection of nodes organized in a hierarchical manner – The first parent node of a tree is the root node – The nodes in a Tree. View are instances of class Tree. Node • Each Tree. Node has a Nodes collection – Contains a list of other Tree. Nodes • Parent property – Returns a reference to the parent node – Returns null if the node is a root node 2006 Pearson Education, Inc. All rights reserved.

69 Click + to expand node and display child nodes Click - to collapse

69 Click + to expand node and display child nodes Click - to collapse node and hide child nodes Root node Child nodes (of Manager 2) Fig. 14. 24 | Tree. View displaying a sample tree. 2006 Pearson Education, Inc. All rights reserved.

70 Fig. 14. 25 | Tree. View properties and an event. 2006 Pearson Education,

70 Fig. 14. 25 | Tree. View properties and an event. 2006 Pearson Education, Inc. All rights reserved.

71 Fig. 14. 26 | Tree. Node properties and methods. (Part 1 of 2.

71 Fig. 14. 26 | Tree. Node properties and methods. (Part 1 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

72 Fig. 14. 26 | Tree. Node properties and methods. (Part 2 of 2.

72 Fig. 14. 26 | Tree. Node properties and methods. (Part 2 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

73 14. 9 Tree. View Control (Cont. ) • Tree. View – Adding nodes

73 14. 9 Tree. View Control (Cont. ) • Tree. View – Adding nodes • Tree. Node Editor • Call method Add 2006 Pearson Education, Inc. All rights reserved.

74 Delete current node Fig. 14. 27 | Tree. Node Editor. 2006 Pearson Education,

74 Delete current node Fig. 14. 27 | Tree. Node Editor. 2006 Pearson Education, Inc. All rights reserved.

Outline 75 Tree. View. Directory. S tructure. Form. cs (1 of 4) An array

Outline 75 Tree. View. Directory. S tructure. Form. cs (1 of 4) An array of strings representing directories 2006 Pearson Education, Inc. All rights reserved.

Outline 76 Tree. View. Directory. S tructure. Form. cs (2 of 4) Create an

Outline 76 Tree. View. Directory. S tructure. Form. cs (2 of 4) Create an object of Tree. Node for the current directory Append the current directory to the parent directory Continue process for the rest of the subdirectories 2006 Pearson Education, Inc. All rights reserved.

Outline Unauthorized access of directories 77 Tree. View. Directory. S tructure. Form. cs (3

Outline Unauthorized access of directories 77 Tree. View. Directory. S tructure. Form. cs (3 of 4) Check to see if the user specified directory exist or not Append directory to directory. Tree. View Add the subdirectories 2006 Pearson Education, Inc. All rights reserved.

Outline 78 Notify user that the directory does not exist Tree. View. Directory. S

Outline 78 Notify user that the directory does not exist Tree. View. Directory. S tructure. Form. cs (a) (b) (4 of 4) 2006 Pearson Education, Inc. All rights reserved.

79 14. 10 List. View Control • List. View – Similar to List. Box

79 14. 10 List. View Control • List. View – Similar to List. Box • Both display lists from which the user can select one or more items – Difference between the two classes is that a List. View can display icons next to the list items • Allows you to define the images used as icons for List. View items – To display images, an Image. List component is required 2006 Pearson Education, Inc. All rights reserved.

80 Fig. 14. 29 | List. View properties and an event. (Part 1 of

80 Fig. 14. 29 | List. View properties and an event. (Part 1 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

81 Fig. 14. 29 | List. View properties and an event. (Part 2 of

81 Fig. 14. 29 | List. View properties and an event. (Part 2 of 2. ) 2006 Pearson Education, Inc. All rights reserved.

82 Fig. 14. 30 | Image Collection Editor window for an Image. List component.

82 Fig. 14. 30 | Image Collection Editor window for an Image. List component. 2006 Pearson Education, Inc. All rights reserved.

Outline 83 List. View. Test. Form. cs (1 of 7) Retrieve the current project’s

Outline 83 List. View. Test. Form. cs (1 of 7) Retrieve the current project’s directory 2006 Pearson Education, Inc. All rights reserved.

Outline 84 Get the number of selected items List. View. Test. Form. cs (2

Outline 84 Get the number of selected items List. View. Test. Form. cs (2 of 7) Create an object that holds the information for the directory Load the parent’s directory 2006 Pearson Education, Inc. All rights reserved.

Outline 85 List. View. Test. Form. cs (3 of 7) Load the selected directory

Outline 85 List. View. Test. Form. cs (3 of 7) Load the selected directory Update display. Label with the current directory 2006 Pearson Education, Inc. All rights reserved.

Outline Remove all elements from browser. List. View 86 List. View. Test. Form. cs

Outline Remove all elements from browser. List. View 86 List. View. Test. Form. cs (4 of 7) Add an element to go back to the parent directory Update the current directory information Store all of the current directory’s files and subdirectories Add all the current directory’s subdirectories to List. View Specify which image to use for the directories 2006 Pearson Education, Inc. All rights reserved.

Outline 87 Add all the current directory’s files to List. View. Test. Form. cs

Outline 87 Add all the current directory’s files to List. View. Test. Form. cs (5 of 7) Specify which image to use for the files Notify user of unauthorized access 2006 Pearson Education, Inc. All rights reserved.

Outline 88 List. View. Test. Form. cs Specify the images (6 of 7) associated

Outline 88 List. View. Test. Form. cs Specify the images (6 of 7) associated with directories and files Initially, load program with the current project’s directory (a) 2006 Pearson Education, Inc. All rights reserved.

Outline 89 (b) List. View. Test. Form. cs (7 of 7) (c) 2006 Pearson

Outline 89 (b) List. View. Test. Form. cs (7 of 7) (c) 2006 Pearson Education, Inc. All rights reserved.

90 Software Engineering Observation 14. 2 When designing applications that run for long periods

90 Software Engineering Observation 14. 2 When designing applications that run for long periods of time, you might choose a large initial delay to improve performance throughout the rest of the program. However, in applications that run for only short periods of time, developers often prefer fast initial loading times and small delays after each action. 2006 Pearson Education, Inc. All rights reserved.

91 14. 11 Tab. Control • Tab. Control – Creates tabbed windows – Specify

91 14. 11 Tab. Control • Tab. Control – Creates tabbed windows – Specify more information in the same amount of space – Contain Tab. Page objects • • Add controls to the Tab. Page objects Add the Tab. Pages to the Tab. Control Only one Tab. Page is displayed at a time To view different Tab. Pages click the appropriate tab – Click event • Generated when Tab. Page’s tab is clicked 2006 Pearson Education, Inc. All rights reserved.

92 Tab windows Fig. 14. 32 | Tabbed windows in Visual Studio. 2006 Pearson

92 Tab windows Fig. 14. 32 | Tabbed windows in Visual Studio. 2006 Pearson Education, Inc. All rights reserved.

93 Tab. Page Tab. Controls in Tab. Page Fig. 14. 33 | Tab. Control

93 Tab. Page Tab. Controls in Tab. Page Fig. 14. 33 | Tab. Control with Tab. Pages example. 2006 Pearson Education, Inc. All rights reserved.

94 Fig. 14. 34 | Tab. Pages added to a Tab. Control. 2006 Pearson

94 Fig. 14. 34 | Tab. Pages added to a Tab. Control. 2006 Pearson Education, Inc. All rights reserved.

95 Fig. 14. 35 | Tab. Control properties and an event. 2006 Pearson Education,

95 Fig. 14. 35 | Tab. Control properties and an event. 2006 Pearson Education, Inc. All rights reserved.

Outline 96 Using. Tabs. Form. cs (1 of 4) Change font color of display.

Outline 96 Using. Tabs. Form. cs (1 of 4) Change font color of display. Label to black Change font color of display. Label to red 2006 Pearson Education, Inc. All rights reserved.

Change font color. Outline of display. Label to green 97 Using. Tabs. Form. cs

Change font color. Outline of display. Label to green 97 Using. Tabs. Form. cs (2 of 4) Change font size to 12 Change font size to 16 2006 Pearson Education, Inc. All rights reserved.

Outline 98 Change font size to 20 Using. Tabs. Form. cs (3 of 4)

Outline 98 Change font size to 20 Using. Tabs. Form. cs (3 of 4) Output “Hello!” Output “Goodbye!” 2006 Pearson Education, Inc. All rights reserved.

Outline (a) 99 (b) Using. Tabs. Form. cs (4 of 4) (c) (d) 2006

Outline (a) 99 (b) Using. Tabs. Form. cs (4 of 4) (c) (d) 2006 Pearson Education, Inc. All rights reserved.

100 Software Engineering Observation 14. 3 A Tab. Page can act as a container

100 Software Engineering Observation 14. 3 A Tab. Page can act as a container for a single logical group of Radio. Buttons, enforcing their mutual exclusivity. To place multiple Radio. Button groups inside a single Tab. Page, you should group Radio. Buttons within Panels or Group. Boxes contained within the Tab. Page. 2006 Pearson Education, Inc. All rights reserved.

101 14. 12 Multiple Document Interface (MDI) Windows • Multiple Document Interface (MDI) –

101 14. 12 Multiple Document Interface (MDI) Windows • Multiple Document Interface (MDI) – Parent window • Main application window • Only one in application – Child window • • Each window inside the application Only one child can be active at a time Cannot also be a parent window As many child windows as you want 2006 Pearson Education, Inc. All rights reserved.

102 MDI parent MDI child Fig. 14. 37 | MDI parent window and MDI

102 MDI parent MDI child Fig. 14. 37 | MDI parent window and MDI child windows. 2006 Pearson Education, Inc. All rights reserved.

103 Single Document Interface (SDI) Multiple Document Interface (MDI) Fig. 14. 38 | SDI

103 Single Document Interface (SDI) Multiple Document Interface (MDI) Fig. 14. 38 | SDI and MDI forms. 2006 Pearson Education, Inc. All rights reserved.

104 14. 12 Multiple Document Interface (MDI) Windows (Cont. ) • Creating an MDI

104 14. 12 Multiple Document Interface (MDI) Windows (Cont. ) • Creating an MDI Form – Create a new Form • Set its Is. Mdi. Container property to true – Create a child Form • Add the child Form to the parent – Set its Mdi. Parent property to the parent Form • Call the child Form’s Show method – To add a child Form to a parent, write: Child. Form. Class child. Form = New Child. Form. Class(); child. Form. Mdi. Parent = parent. Form; child. Form. Show(); 2006 Pearson Education, Inc. All rights reserved.

105 Fig. 14. 39 | MDI parent and MDI child properties, method and event.

105 Fig. 14. 39 | MDI parent and MDI child properties, method and event. 2006 Pearson Education, Inc. All rights reserved.

106 Good Programming Practice 14. 1 When creating MDI applications, include a menu that

106 Good Programming Practice 14. 1 When creating MDI applications, include a menu that displays a list of the open child windows. This helps the user select a child window quickly, rather than having to search for it in the parent window. 2006 Pearson Education, Inc. All rights reserved.

107 Maximized child window icons: minimize, restore and close Parent window icons: minimize, maximize

107 Maximized child window icons: minimize, restore and close Parent window icons: minimize, maximize and close (a) (b) Minimized child window icons: restore, maximize and close Parent title bar indicates maximized child Fig. 14. 40 | Minimized and maximized child windows. 2006 Pearson Education, Inc. All rights reserved.

108 Child windows list 9 or more child windows enables the More Windows… option

108 Child windows list 9 or more child windows enables the More Windows… option Fig. 14. 41 | Menu. Item property Mdi. List example. 2006 Pearson Education, Inc. All rights reserved.

109 (a) Arrange. Icons (b) Cascade (c) Tile. Horizontal (d) Tilevertical Fig. 14. 42

109 (a) Arrange. Icons (b) Cascade (c) Tile. Horizontal (d) Tilevertical Fig. 14. 42 | Mdi. Layout enumeration values. 2006 Pearson Education, Inc. All rights reserved.

Outline 110 Using. MDIForm. cs (1 of 4) Create a new child form Set

Outline 110 Using. MDIForm. cs (1 of 4) Create a new child form Set this form to be the child form’s parent Show the child form 2006 Pearson Education, Inc. All rights reserved.

Outline 111 Create another new child form Using. MDIForm. cs Set this form(2 to

Outline 111 Create another new child form Using. MDIForm. cs Set this form(2 to of be 4) the child form’s parent Show the child form Create another new child form Set this form to be the child form’s parent Show the child form Terminate program 2006 Pearson Education, Inc. All rights reserved.

Outline 112 Using. MDIForm. cs (3 of 4) Specify how to display the child

Outline 112 Using. MDIForm. cs (3 of 4) Specify how to display the child forms on the MDI parent form 2006 Pearson Education, Inc. All rights reserved.

Outline (a) 113 (b) Using. MDIForm. cs (4 of 4) (c) (d) 2006 Pearson

Outline (a) 113 (b) Using. MDIForm. cs (4 of 4) (c) (d) 2006 Pearson Education, Inc. All rights reserved.

Outline 114 Child. Form. cs Child. Form’s constructor Display the image specified by the

Outline 114 Child. Form. cs Child. Form’s constructor Display the image specified by the filename 2006 Pearson Education, Inc. All rights reserved.

115 14. 13 Visual Inheritance • Visual Inheritance – Enables to achieve visual consistency

115 14. 13 Visual Inheritance • Visual Inheritance – Enables to achieve visual consistency across applications – All Forms created so far derives from class System. Windows. Form – Derived Forms contains the functionality of its base class Form • Includes any base-class properties, methods, variables and controls – The derived class also inherits all visual aspects • Ex: sizing, component layout, spacing between GUI components, colors and fonts 2006 Pearson Education, Inc. All rights reserved.

Outline 116 Visual. Inheritance. F orm. cs Visual. Inheritance. Form inherits from Form Display

Outline 116 Visual. Inheritance. F orm. cs Visual. Inheritance. Form inherits from Form Display Message. Box 2006 Pearson Education, Inc. All rights reserved.

117 Fig. 14. 46 | Form demonstrating visual inheritance. 2006 Pearson Education, Inc. All

117 Fig. 14. 46 | Form demonstrating visual inheritance. 2006 Pearson Education, Inc. All rights reserved.

Outline 118 Visual. Inheritance. T est. Form. cs (1 of 2) Visual. Inheritance. Form.

Outline 118 Visual. Inheritance. T est. Form. cs (1 of 2) Visual. Inheritance. Form. Test inherits from Visual. Inheritance. Form Display Message. Box 2006 Pearson Education, Inc. All rights reserved.

Outline 119 Visual. Inheritance. T est. Form. cs (2 of 2) Derived class cannot

Outline 119 Visual. Inheritance. T est. Form. cs (2 of 2) Derived class cannot modify these controls. Derived class can modify this control. 2006 Pearson Education, Inc. All rights reserved.

120 14. 14 User-Defined Controls • User-Defined Controls –. NET Framework allow you to

120 14. 14 User-Defined Controls • User-Defined Controls –. NET Framework allow you to create custom controls • Appear in the user’s Toolbox • Can be added to Forms, Panels or Group. Boxes in the same way that we add other predefined controls – The simplest way to create a custom control is to derive a class from an existing control • Useful if you want to add functionality to an existing control 2006 Pearson Education, Inc. All rights reserved.

121 14. 14 User-Defined Controls (Cont. ) – Method On. Paint • • Contained

121 14. 14 User-Defined Controls (Cont. ) – Method On. Paint • • Contained by all controls Called when a component must be redrawn Passed a Paint. Event. Args object The derived control’s On. Paint method is called through polymorphism • The base class’s On. Paint implementation is not called – Must call it explicitly from the new On. Paint implementation before we execute our custom-paint code • Ensure the control will be displayed correctly 2006 Pearson Education, Inc. All rights reserved.

122 14. 14 User-Defined Controls (Cont. ) – User. Control • Create a new

122 14. 14 User-Defined Controls (Cont. ) – User. Control • Create a new control composed of existing controls • Acts as a container for the controls added to it • Contains constituent controls – Controls added to a custom control – Does not determine how these constituent controls are displayed – Method On. Paint of the User. Control • Cannot be overridden – To control the appearance of each constituent control, you must handle each control’s Paint event • The Paint event handler is passed a Paint. Event. Args object 2006 Pearson Education, Inc. All rights reserved.

123 14. 14 User-Defined Controls (Cont. ) – Create a brand new control by

123 14. 14 User-Defined Controls (Cont. ) – Create a brand new control by inheriting from class Control • Does not define any specific behavior • Control handles the items associated with all controls – Ex: events and sizing handles • Method On. Paint – Should contain a call to the base class’s On. Paint method – Add code that draws custom graphics inside the overridden On. Paint method 2006 Pearson Education, Inc. All rights reserved.

124 Fig. 14. 48 | Custom control creation. 2006 Pearson Education, Inc. All rights

124 Fig. 14. 48 | Custom control creation. 2006 Pearson Education, Inc. All rights reserved.

Outline 125 Clock. User. Control. cs Update time to display. Label at every tick

Outline 125 Clock. User. Control. cs Update time to display. Label at every tick event 2006 Pearson Education, Inc. All rights reserved.

126 14. 14 User-Defined Controls (Cont. ) • Share custom controls with other developers

126 14. 14 User-Defined Controls (Cont. ) • Share custom controls with other developers (Example: User. Control) – Create a new Class Library project. – Delete Class 1. cs, initially provided with the application. – Right click the project in the Solution Explorer and select Add > User Control. – Inside the project, add controls and functionality to the User. Control. – Build the project. – Create a new Windows application. – Right click the Tool. Box and select Choose Items. In the Choose Toolbox Items dialog, click Browse for the. dll file from the class library created. The item will then appear in the Choose Toolbox Items dialog. If it is not already checked, check this item. Click OK to add the item to the Toolbox. This control can now be added to the Form as if it were any other control. 2006 Pearson Education, Inc. All rights reserved.

127 Fig. 14. 50 | Custom-control creation. 2006 Pearson Education, Inc. All rights reserved.

127 Fig. 14. 50 | Custom-control creation. 2006 Pearson Education, Inc. All rights reserved.

128 Fig. 14. 51 | Custom control added to the Tool. Box. 2006 Pearson

128 Fig. 14. 51 | Custom control added to the Tool. Box. 2006 Pearson Education, Inc. All rights reserved.

129 New Tool. Box icon Newly inserted control Fig. 14. 52 | Custom control

129 New Tool. Box icon Newly inserted control Fig. 14. 52 | Custom control added to a Form. 2006 Pearson Education, Inc. All rights reserved.