1 2 Introduction to the Visual C 2005

  • Slides: 62
Download presentation
1 2 Introduction to the Visual C# 2005 Express Edition IDE 2006 Pearson Education,

1 2 Introduction to the Visual C# 2005 Express Edition IDE 2006 Pearson Education, Inc. All rights reserved.

2 Seeing is believing. — Proverb Form ever follows function. — Louis Henri Sullivan

2 Seeing is believing. — Proverb Form ever follows function. — Louis Henri Sullivan Intelligence …is the faculty of making artificial objects, especially tools to make tools. — Henri-Louis Bergson 2006 Pearson Education, Inc. All rights reserved.

3 OBJECTIVES In this chapter you will learn: § The basics of the Visual

3 OBJECTIVES In this chapter you will learn: § The basics of the Visual Studio Integrated Development Environment (IDE) that assists you in writing, running and debugging your Visual C# programs. § Visual Studio's help features. § Key commands contained in the IDE's menus and toolbars. § The purpose of the various kinds of windows in the Visual Studio 2005 IDE. § What visual programming is and how it simplifies and speeds program development. § To create, compile and execute a simple Visual C# program that displays text and an image using the Visual Studio IDE and the technique of visual programming. 2006 Pearson Education, Inc. All rights reserved.

4 2. 1 Introduction 2. 2 Overview of the Visual Studio 2005 IDE 2.

4 2. 1 Introduction 2. 2 Overview of the Visual Studio 2005 IDE 2. 3 Menu Bar and Toolbar 2. 4 Navigating the Visual Studio 2005 IDE 2. 4. 1 Solution Explorer 2. 4. 2 Toolbox 2. 4. 3 Properties Window 2. 5 Using Help 2. 6 Using Visual Programming to Create a Simple Program Displaying Text and an Image 2. 7 Wrap-Up 2. 8 Web Resources 2006 Pearson Education, Inc. All rights reserved.

5 2. 1 Introduction • Visual Studio 2005 ─ Microsoft Integrate Development Environment (IDE)

5 2. 1 Introduction • Visual Studio 2005 ─ Microsoft Integrate Development Environment (IDE) • Create, run, and debug programs • Visual Programming ─ Create program by dragging and dropping predefined building blocks into place 2006 Pearson Education, Inc. All rights reserved.

6 2. 2 Overview of the Visual Studio 2005 IDE • Microsoft Visual C#

6 2. 2 Overview of the Visual Studio 2005 IDE • Microsoft Visual C# Express Edition ─ Only support Visual C# programming language • Start page (Fig. 2. 1) ─ A list of links to resources in the IDE and on the internet • Visual C# Express Headlines and MSDN (Fig. 2. 2) ─ This section provides links to information about programming in C# • Note: MSDN stands for Microsoft Developer Network 2006 Pearson Education, Inc. All rights reserved.

7 New Project button Hidden window Start Page tab Start Page links Empty Solution

7 New Project button Hidden window Start Page tab Start Page links Empty Solution Explorer (no projects open) Fig. 2. 1 | Start Page in Visual C# 2005 Express Edition. 2006 Pearson Education, Inc. All rights reserved.

Requested Web page (URL in location bar drop-down menu) Selected tab requested Web page

Requested Web page (URL in location bar drop-down menu) Selected tab requested Web page 8 Fig. 2. 2 | Displaying a Web page in Visual Studio. 2006 Pearson Education, Inc. All rights reserved.

9 2. 2 Overview of the Visual Studio 2005 IDE (cont. ) • Creating

9 2. 2 Overview of the Visual Studio 2005 IDE (cont. ) • Creating a New Project ─ New Project Dialog (Fig. 2. 3) • Dialog to choose type of program to build ─ Windows Form Designer (Fig. 2. 4) • Design portion of IDE ─ Properties • Change a component of the program (Fig. 2. 5) ─ Buttons • Confirm action, change and etc. (Fig. 2. 6) 2006 Pearson Education, Inc. All rights reserved.

10 Visual C# Windows Application (selected) Default project name (provided by Visual Studio) Description

10 Visual C# Windows Application (selected) Default project name (provided by Visual Studio) Description of selected project template (provided by Visual Studio) Fig. 2. 3 | New Project dialog. 2006 Pearson Education, Inc. All rights reserved.

Active tab Tabs Form (Windows application) Menu bar Solution Explorer window 11 Properties window

Active tab Tabs Form (Windows application) Menu bar Solution Explorer window 11 Properties window Fig. 2. 4 | Design view of the IDE. 2006 Pearson Education, Inc. All rights reserved.

12 Text box (displaying the text Form 1), which can be modified. Fig. 2.

12 Text box (displaying the text Form 1), which can be modified. Fig. 2. 5 | Example of a text box control in the Visual Studio IDE. 2006 Pearson Education, Inc. All rights reserved.

13 OK button Cancel button Fig. 2. 6 | Examples of buttons in the

13 OK button Cancel button Fig. 2. 6 | Examples of buttons in the Visual Studio IDE. 2006 Pearson Education, Inc. All rights reserved.

14 2. 3 Menu Bar and Toolbar • Menu Bar (Fig. 2. 7) ─

14 2. 3 Menu Bar and Toolbar • Menu Bar (Fig. 2. 7) ─ The bar of where the commands for managing the IDE and for developing, maintaining and executing programs are located • Tool Bar (Fig. 2. 9) ─ The bar of where the more common commands are located • Tool Tip (Fig. 2. 12) ─ Description of a icon 2006 Pearson Education, Inc. All rights reserved.

15 Fig. 2. 7 | Visual Studio menu bar. 2006 Pearson Education, Inc. All

15 Fig. 2. 7 | Visual Studio menu bar. 2006 Pearson Education, Inc. All rights reserved.

16 Fig. 2. 8 | Summary of Visual Studio 2005 IDE menus (Part 1

16 Fig. 2. 8 | Summary of Visual Studio 2005 IDE menus (Part 1 of 2). 2006 Pearson Education, Inc. All rights reserved.

17 Fig. 2. 8 | Summary of Visual Studio 2005 IDE menus (Part 2

17 Fig. 2. 8 | Summary of Visual Studio 2005 IDE menus (Part 2 of 2). 2006 Pearson Education, Inc. All rights reserved.

18 a) New project Open File Add Item Save All Cut Navigate backwards Undo

18 a) New project Open File Add Item Save All Cut Navigate backwards Undo Copy Redo Paste Start Navigate forwards Solution Configurations Other Windows b) Solution Platforms Properties Window Find in files Solution Explorer Toolbox Window Object browser Start Page Fig. 2. 9 | Standard toolbar in Visual Studio. 2006 Pearson Education, Inc. All rights reserved.

Standard toolbar 19 Build toolbar added to the Standard toolbar Fig. 2. 10 |

Standard toolbar 19 Build toolbar added to the Standard toolbar Fig. 2. 10 | Adding the Build toolbar to the IDE. 2006 Pearson Education, Inc. All rights reserved.

20 Toolbar Down arrow indicates additional commands Fig. 2. 11 | IDE toolbar icon

20 Toolbar Down arrow indicates additional commands Fig. 2. 11 | IDE toolbar icon showing additional commands. 2006 Pearson Education, Inc. All rights reserved.

21 Tool tip displayed when the mouse pointer rests over the New Project icon

21 Tool tip displayed when the mouse pointer rests over the New Project icon Fig. 2. 12 | Tool tip demonstration. 2006 Pearson Education, Inc. All rights reserved.

22 Properties window Solution Explorer Toolbox Fig. 2. 13 | Toolbar icons for three

22 Properties window Solution Explorer Toolbox Fig. 2. 13 | Toolbar icons for three Visual Studio windows. 2006 Pearson Education, Inc. All rights reserved.

23 2. 4 Navigating the Visual Studio 2005 IDE • Auto-Hide (Fig. 2. 14

23 2. 4 Navigating the Visual Studio 2005 IDE • Auto-Hide (Fig. 2. 14 – 2. 16) ─ Space saving feature • Solution Explorer (Fig. 2. 17 – 2. 20) ─ Provides access to all of the files in a solution • Toolbox (Fig. 2. 21) ─ Contains icons representing controls used to customize form • Properties Window (Fig. 2. 22) ─ The window to change information about a form or control 2006 Pearson Education, Inc. All rights reserved.

24 Tab for hidden window (auto-hide enabled) Fig. 2. 14 | Auto-hide feature demonstration.

24 Tab for hidden window (auto-hide enabled) Fig. 2. 14 | Auto-hide feature demonstration. 2006 Pearson Education, Inc. All rights reserved.

25 Toolbox title bar Horizontal orientation for pin icon Fig. 2. 15 | Displaying

25 Toolbox title bar Horizontal orientation for pin icon Fig. 2. 15 | Displaying a hidden window when auto-hide is enabled. 2006 Pearson Education, Inc. All rights reserved.

26 Toolbox “pinned down” Vertical orientation for pin icon Fig. 2. 16 | Disabling

26 Toolbox “pinned down” Vertical orientation for pin icon Fig. 2. 16 | Disabling auto-hide (“pinning down” a window). 2006 Pearson Education, Inc. All rights reserved.

27 Show all files icon Toolbar Startup project Fig. 2. 17 | Solution Explorer

27 Show all files icon Toolbar Startup project Fig. 2. 17 | Solution Explorer with an open project. 2006 Pearson Education, Inc. All rights reserved.

28 Plus box Minus box Fig. 2. 18 | Solution Explorer showing plus boxes

28 Plus box Minus box Fig. 2. 18 | Solution Explorer showing plus boxes and minus boxes for expanding and collapsing the tree to show or hide project files. 2006 Pearson Education, Inc. All rights reserved.

29 Minus box indicates that the file of folder is expanded (changed from plus

29 Minus box indicates that the file of folder is expanded (changed from plus box) Fig. 2. 19 | Solution Explorer expanding the Properties file after clicking its plus box. 2006 Pearson Education, Inc. All rights reserved.

30 Plus boxes indicate that the file or folder is collapsed (changed from minus

30 Plus boxes indicate that the file or folder is collapsed (changed from minus box) Fig. 2. 20 | Solution Explorer collapsing all files after clicking any minus boxes. 2006 Pearson Education, Inc. All rights reserved.

31 Group names Controls Fig. 2. 21 | Toolbox window displaying controls for the

31 Group names Controls Fig. 2. 21 | Toolbox window displaying controls for the Common Controls group. 2006 Pearson Education, Inc. All rights reserved.

Component selection drop-down list 32 Toolbar Categorized icon Alphabetical icon Description of the Text

Component selection drop-down list 32 Toolbar Categorized icon Alphabetical icon Description of the Text property Properties values Fig. 2. 22 | Properties window displaying the Text property of the Form. 2006 Pearson Education, Inc. All rights reserved.

33 2. 5 Using Help • Dynamic Help (Fig. 2. 24) ─ Excellent way

33 2. 5 Using Help • Dynamic Help (Fig. 2. 24) ─ Excellent way to get information quickly about the IDE and its features • Context-Sensitive Help (Fig. 2. 25) ─ Immediately displays a relevant help article 2006 Pearson Education, Inc. All rights reserved.

34 Fig. 2. 23 | Help menu commands. 2006 Pearson Education, Inc. All rights

34 Fig. 2. 23 | Help menu commands. 2006 Pearson Education, Inc. All rights reserved.

35 How Do I Selected Item Dynamic Help window Search Index Contents Relevant help

35 How Do I Selected Item Dynamic Help window Search Index Contents Relevant help articles on the selected item (e. g. , the Form) Fig. 2. 24 | Dynamic Help window. 2006 Pearson Education, Inc. All rights reserved.

36 Fig. 2. 25 | Using context-sensitive help. 2006 Pearson Education, Inc. All rights

36 Fig. 2. 25 | Using context-sensitive help. 2006 Pearson Education, Inc. All rights reserved.

37 Help options selected Show Help using: box Show all settings check box Fig.

37 Help options selected Show Help using: box Show all settings check box Fig. 2. 26 | Options dialog displaying Help settings. 2006 Pearson Education, Inc. All rights reserved.

38 2. 6 Using Visual Programming to Create a Simple Program Displaying Text and

38 2. 6 Using Visual Programming to Create a Simple Program Displaying Text and an Image • Creating a Simple Program ─ ─ ─ ─ Create the new project (Fig. 2. 28 -2. 30) Set the text in in the form’s title bar (Fig. 2. 31) Resize the form (Fig. 2. 32 -2. 33) Change the form’s background color (Fig. 2. 34 -2. 35) Add a Label control to the form (Fig. 2. 36) Customize the label’s appearance (Fig. 2. 37 -2. 38) Set the label’s font size (Fig. 2. 39 -2. 40) 2006 Pearson Education, Inc. All rights reserved.

39 2. 6 Using Visual Programming to Create a Simple Program Displaying Text and

39 2. 6 Using Visual Programming to Create a Simple Program Displaying Text and an Image (Cont. ) • Creating a Simple Program (Cont. ) ─ ─ ─ Align the label’s text (Fig. 2. 41) Add a Picture. Box to the form (Fig. 2. 42) Insert an image (Fig. 2. 43 -2. 47) Save the project Run the project (Fig. 2. 47 -2. 49) Terminate execution 2006 Pearson Education, Inc. All rights reserved.

40 Label control Picture. Box control Fig. 2. 27 | Simple program executing. 2006

40 Label control Picture. Box control Fig. 2. 27 | Simple program executing. 2006 Pearson Education, Inc. All rights reserved.

41 Template types Type in the project name Fig. 2. 28 | New Project

41 Template types Type in the project name Fig. 2. 28 | New Project dialog. 2006 Pearson Education, Inc. All rights reserved.

42 Fig. 2. 29 | Save Project dialog. 2006 Pearson Education, Inc. All rights

42 Fig. 2. 29 | Save Project dialog. 2006 Pearson Education, Inc. All rights reserved.

43 Selected Project location Click to set project location Fig. 2. 30 | Setting

43 Selected Project location Click to set project location Fig. 2. 30 | Setting the project location in the Project Location dialog. 2006 Pearson Education, Inc. All rights reserved.

44 Name and type of object Selected property Property value Property description Fig. 2.

44 Name and type of object Selected property Property value Property description Fig. 2. 31 | Setting the form’s Text property in the Properties window. 2006 Pearson Education, Inc. All rights reserved.

45 Title bar Enabled sizing handles Fig. 2. 32 | Form with enabled sizing

45 Title bar Enabled sizing handles Fig. 2. 32 | Form with enabled sizing handles. 2006 Pearson Education, Inc. All rights reserved.

46 Fig. 2. 33 | Resized form. 2006 Pearson Education, Inc. All rights reserved.

46 Fig. 2. 33 | Resized form. 2006 Pearson Education, Inc. All rights reserved.

47 Current color Custom palette Down-arrow button Light blue Fig. 2. 34 | Changing

47 Current color Custom palette Down-arrow button Light blue Fig. 2. 34 | Changing the form’s Back. Color property. 2006 Pearson Education, Inc. All rights reserved.

48 New background color Fig. 2. 35 | Form with new Back. Color property

48 New background color Fig. 2. 35 | Form with new Back. Color property applied. 2006 Pearson Education, Inc. All rights reserved.

49 Label control Fig. 2. 36 | Adding a label to the form. 2006

49 Label control Fig. 2. 36 | Adding a label to the form. 2006 Pearson Education, Inc. All rights reserved.

50 Auto. Size property Fig. 2. 37 | Changing the Label’s Auto. Size property

50 Auto. Size property Fig. 2. 37 | Changing the Label’s Auto. Size property to False. 2006 Pearson Education, Inc. All rights reserved.

51 Sizing handles Label centered with updated Text property Fig. 2. 38 | GUI

51 Sizing handles Label centered with updated Text property Fig. 2. 38 | GUI after the form and Label have been customized. 2006 Pearson Education, Inc. All rights reserved.

52 Ellipsis button Fig. 2. 39 | Properties window displaying the Label’s properties. 2006

52 Ellipsis button Fig. 2. 39 | Properties window displaying the Label’s properties. 2006 Pearson Education, Inc. All rights reserved.

53 Current font Font sample Fig. 2. 40 | Font dialog for selecting fonts,

53 Current font Font sample Fig. 2. 40 | Font dialog for selecting fonts, styles and sizes. 2006 Pearson Education, Inc. All rights reserved.

54 Text alignment options Middle-center alignment option Fig. 2. 41 | Centering the Label’s

54 Text alignment options Middle-center alignment option Fig. 2. 41 | Centering the Label’s text. 2006 Pearson Education, Inc. All rights reserved.

55 Updated Label Picture. Box Fig. 2. 42 | Inserting and aligning a Picture.

55 Updated Label Picture. Box Fig. 2. 42 | Inserting and aligning a Picture. Box. 2006 Pearson Education, Inc. All rights reserved.

56 Image property value (no image selected) Fig. 2. 43 | Image property of

56 Image property value (no image selected) Fig. 2. 43 | Image property of the Picture. Box. 2006 Pearson Education, Inc. All rights reserved.

57 Fig. 2. 44 | Select Resource dialog to select an image for the

57 Fig. 2. 44 | Select Resource dialog to select an image for the Picture. Box. 2006 Pearson Education, Inc. All rights reserved.

58 Image file name Fig. 2. 45 | Select Resource dialog displaying a preview

58 Image file name Fig. 2. 45 | Select Resource dialog displaying a preview of selected image. 2006 Pearson Education, Inc. All rights reserved.

59 Size. Mode property set to Stretch. Image Fig. 2. 46 | Scaling an

59 Size. Mode property set to Stretch. Image Fig. 2. 46 | Scaling an image to the size of the Picture. Box. 2006 Pearson Education, Inc. All rights reserved.

60 Newly Inserted image Fig. 2. 47 | Picture. Box displaying an image. 2006

60 Newly Inserted image Fig. 2. 47 | Picture. Box displaying an image. 2006 Pearson Education, Inc. All rights reserved.

61 Build menu Fig. 2. 48 | Building a solution. 2006 Pearson Education, Inc.

61 Build menu Fig. 2. 48 | Building a solution. 2006 Pearson Education, Inc. All rights reserved.

62 Form Running program Close box Fig. 2. 49 | IDE in run mode,

62 Form Running program Close box Fig. 2. 49 | IDE in run mode, with the running program in the foreground window. 2006 Pearson Education, Inc. All rights reserved.