1 Tutorial 2 - Welcome Application Introducing, the Visual Studio.NET IDE Outline 2.1 Test-Driving the Welcome Application 2.2 Overview of the Visual Studio.NET 2003 IDE 2.3 Creating a Project for the Welcome Application 2.4 Menu Bar and Toolbar 2.5 Visual Studio.NET IDE Windows 2.6 Auto Hide 2.7 Using Help 2.8 Saving and Closing Solutions in Visual Studio.NET 2.9 Internet and Web Resources 2.10 Wrap-Up
2 Objectives In this tutorial, you will learn to: Navigate Visual Studio.NET s Start Page. Create a C# solution. Use the IDE s menus and toolbars. Manipulate windows in the Visual Studio.NET IDE. Use the Auto Hide feature. Use the Visual Studio.NET IDE s help features. Close a C# solution.
2.1 Test-Driving the Welcome Application 3 Application Requirements A software company (Deitel & Associates) has asked you to develop a C# application that will display the message Welcome to C#! and a picture of the company s bug mascot. To build this application, you must first familiarize yourself with the Visual Studio.NET IDE.
4 2.1 Test-Driving the Welcome Application Figure 2.1 Contents of C:\Examples\Tutorial02. Contents of C:\Examples\Tutorial02 Opening the application Locate the directory Double click the executable (.exe) file
2.1 Test-Driving the Welcome Application 5 Figure 2.2 Welcome application running. Close box
6 2.1 Test-Driving the Welcome Application Application running Click close box to close application
2.2 Overview of the Visual Studio.NET IDE 7 Figure 2.3 Start Page Start Page in Visual Studio.NET. Page loaded when Projects tab is clicked (This page also is displayed when the Start Page is loaded) Empty project list Buttons
8 2.2 Overview of the Visual Studio.NET IDE Start Page Opened when Visual Studio.NET is opened Contains helpful links Allows creation or opening of a project Displays recent projects
2.2 Overview of the Visual Studio.NET IDE 9 Figure 2.4 Start Page in Visual Studio.NET. Recent projects Welcome Project Hidden windows (Toolbox and Server Explorer)
10 2.2 Overview of the Visual Studio.NET IDE Start Page Allows Web browsing Contains internal Web browser Location bar specifies Web page to visit Navigation Buttons provided for convenient navigation Hides windows (Server Explorer and Toolbox) as tabs
2.2 Overview of the Visual Studio.NET IDE 11 Figure 2.5 Web site (www.deitel.com) being entered in the location bar. Start Page Start Page Links Page loaded when Get Started is clicked
12 2.2 Overview of the Visual Studio.NET IDE Entering an address in the location bar Brings you to specified Web site
2.2 Overview of the Visual Studio.NET IDE 13 Figure 2.6 DEITEL home page displayed in the Visual Studio.NET IDE. Navigation (Courtesy Buttons of Deitel & Associates, Entering Inc.) in the location bar www.deitel.com
2.3 Creating a Project for the Welcome Application 14 Figure 2.7 Solutions can contain one or more projects. So lu tio n Project So lut io n Projec t So lu tio n Pro jec t Project Pro jec t Project Applications Contain one solution Solutions contain one or more projects
2.3 Creating a Project for the Welcome Application 15 Figure 2.8 New Project Button. New Project Button
2.3 Creating a Project for the Welcome Application 16 Figure 2.9 Title bar (displaying New Project) New Project dialog. C# Windows Application (selected) Visual C# Projects folder (selected) Templates: pane Projects Types: pane Description of project selected in Templates: pane Location of new project Default project and solution name
2.3 Creating a Project for the Welcome Application 17 Clicking the New Project Button Displays New Project dialog Choose type of project to create Choose project template Specify name of project Browse Button Specify location of project
2.3 Creating a Project for the Welcome Application 18 Figure 2.10 New Project dialog with updated project information. Updated project location Updated project and solution name Browse Button
2.3 Creating a Project for the Welcome Application 19 Figure 2.11 Project Location dialog. SimplyCSP directory (selected) Open Button
2.3 Creating a Project for the Welcome Application 20 Project Location dialog Allows you to specify location of project Select SimplyCSP
2.3 Creating a Project for the Welcome Application 21 Visual Studio.NET Tabs provide easy access to multiple files Active tab displayed in bold Menu bar contains menus that contain commands Solution Explorer lists all files in solution Form1 represents new Windows application GUI Properties window lists properties of Form and controls.
2.3 Creating a Project for the Welcome Application 22 Figure 2.12 Menu bar Design view of Visual Studio.NET. Tabs Solution Explorer Active tab Properties window Form (Windows application) titled Form1
2.3 Creating a Project for the Welcome Application 23 Internet Explorer GUI Menu bar contains six menu items Toolbar contains Buttons that execute tasks Users type Web site address in ComboBox Drop-down arrow allows user to select previously visited page Label identifies ComboBox s purpose Web page s TextBox allows user to input data
2.3 Creating a Project for the Welcome Application 24 Figure 2.13 Internet Explorer window with GUI controls labeled. (Web site content courtesy of Deitel & Associates, Inc.) Drop-down arrow Title bar Menu bar Menu (Help) Toolbar Label Web site requested by user Button (displaying an icon) ComboBox TextBox
25 2.4 Menu Bar and Toolbar Figure 2.14 Visual Studio.NET IDE menu bar. Visual Studio.NET menu bar Contains commands for: Managing the IDE Developing applications Executing applications Each menu has menu items that perform certain actions
2.4 Menu Bar and Toolbar 26 Menu Description File Contains commands for opening and closing projects, printing project data, etc. Edit Contains commands such as Cut, Paste, Undo, etc. View Contains commands for displaying IDE windows and toolbars. Project Contains commands for managing a solution s projects and their files. Build Contains commands for compiling a Visual Basic.NET application. Debug Contains commands for identifying and correcting problems in applications. Also contains commands for running applications. Data Contains commands for interacting with databases, which store the data that an application processes. [Note: You will learn database concepts in Tutorial 25, ATM Application.] Format Contains commands for aligning and spacing a Form s controls. Tools Contains commands for accessing additional IDE tools and options that enable customization of the IDE. Window Contains commands for hiding, opening, closing and displaying IDE windows. Help Contains commands for accessing the IDE s help features. Figure 2.15 Visual Studio.NET IDE menu summary.
27 2.4 Menu Bar and Toolbar Figure 2.16 IDE toolbar. Toolbar icon indicates a command to open a project or solution Toolbar Down arrow indicates additional commands are available Toolbar Contains icons that represent commonly used commands Down arrow indicates additional commands
28 2.4 Menu Bar and Toolbar Figure 2.17 Tool-tip demonstration. Tool tip displayed when the mouse pointer has rested on the icon for a few seconds Tool tip Appears when mouse pointer held over icon Displays description of icon
29 2.5 Visual Studio.NET IDE Windows Figure 2.18 Toolbar icons for three Visual Studio.NET IDE windows. Properties icon Solution Explorer icon Class View icon Toolbar icons Contains commands for opening: Solution Explorer window Properties window Object Browser window Class View window Toolbox Object Browser icon Toolbox icon
30 2.5 Visual Studio.NET IDE Windows Figure 2.19 Solution Explorer with an open solution. Toolbar Expanded node (Minus box collapses when clicked Form file Properties window icon Project name Collapsed node (Plus box expands when clicked) Solution Explorer Provides access to all files in solution Nodes allow groups to be expanded and collapsed
31 2.5 Visual Studio.NET IDE Windows Figure 2.20 Expanded node. Expanded node (minus box) Project name (selected) Solution Explorer Minus box represents expanded node
32 2.5 Visual Studio.NET IDE Windows Figure 2.21 Collapsed node. Collapsed node (plus box) Solution name Solution Explorer Plus box represents collapsed node
33 2.5 Visual Studio.NET IDE Windows Toolbox Displayed by selecting View > Toolbox Contains five tabs, each grouping related controls: Data Components Windows Forms Clipboard Ring General Selecting tab displays controls in that group Black scroll arrows used to display additional controls If scroll arrow is gray, it is disabled, no more controls to choose from
2.5 Visual Studio.NET IDE Windows 34 Figure 2.22 Tabs Toolbox displaying the contents of the Windows Forms tab. Scroll arrow (disabled) Controls Additional Windows Forms tab controls (displayed after the down-scroll key has been clicked several times Tabs Scroll arrow (enabled)
35 2.5 Visual Studio.NET IDE Windows Properties window Displayed by selecting View > Properties Window Allows quick setting of a control s properties Displays brief description of property Do not have to remember a properties settings Each Form or control has its own properties Component object box: Allows you to select control to change properties Displays control s name and class
2.5 Visual Studio.NET IDE Windows 36 Figure 2.23 Properties window displaying a Form s properties. Object s name (Form1) Component object box Categorized icon Alphabetic icon Selected property Design icon Properties (left column) Description of selected property Object s class (System.Windows.Forms.Form) Down arrow for selecting Form or control objects Toolbar Scrollbar Scrollbox Property values (right column)
37 2.6 Auto Hide Figure 2.24 Hidden-window tabs. Tabs for hidden windows Toolbar Toolbar contains tabs that represent hidden windows When tabs selected, hidden window appears Window closes when mouse moves out of windows area
38 2.6 Auto Hide Auto Hide Space saving feature When pin icon is vertical, Auto Hide is disabled Window stays open
2.6 Auto Hide 39 Figure 2.25 Displaying a hidden window with Auto Hide enabled. Title bar Horizontal pin icon (Auto Hide enabled) Mouse pointer over the tab for the Toolbox Toolbox is displayed when the mouse pointer is placed on the tab for the Toolbox
40 2.6 Auto Hide Auto hide enabled Horizontal pin icon Toolbox is displayed when mouse pointer is placed on the tab
2.6 Auto Hide 41 Figure 2.26 area. Hiding the Toolbox by moving the mouse pointer outside of Toolbox s Mouse pointer outside the tab for the Toolbox (Toolbox windows is hidden)
2.6 Auto Hide 42 Figure 2.27 Pin icon in vertical position. Vertical pin icon (Auto Hide is disabled) Vertical pin icon
2.7 Using Help 43 Command Contents Index Description Displays a categorized table of contents in which help articles are organized by topic. Displays an alphabetized list of topics through which you can browse. Search Allows you to find help articles based on search keywords. Figure 2.28 Help menu commands.
44 2.7 Using Help Dynamic Help Articles that apply to current content Toolbar Toolbar provides access to Contents Index Search
2.7 Using Help 45 Figure 2.29 Dynamic Help window. Dynamic Help window Selected item Toolbar Contents Search Index Relevant help article links
2.8 Saving and Closing Solutions in Visual Studio.NET 46 Saving the project Select File > Save All Closing the solution Select File > Close Solution Closing the IDE Click Visual Studio.NET s close box