Introduction to the Visual
Studio .NET IDE
Powerpoint slides modified from
Deitel & Deitel
Objectives
Familiarized on the C#
environment
Create simply program using
C#
Used C# as one of the
programming language
2
Visual Studio .NET IDE
New project dialogue
C#
.NET project
Group of related files, images, and documentation
C#
.NET solution
Group of projects creating one or a group of
applications
Windows
Applications
Anything that runs in the Windows OS
Visual Studio .NET IDE Overview
description of
selected project
Visual C#
projects folder
Visual C#
Windows
Application
(selected)
project name
Fig. 2.3
New Project dialog.
project location
Visual Studio .NET IDE
IDE after a new project
The
form
Grey rectangle in window
Represents the projects window
Part of the GUI
Graphical components for user interaction
User can enter data (input)
Shows user instructions or results (output)
Tabs
One tab appears for each open document
5
Visual Studio .NET IDE Overview
Tabs
Active tab
Menu
Menu bar
Solution Explorer
window
Properties window
Form (Windows application)
Menu Bar
The menu bar
Commands
for developing and executing
programs
To create new projects select:
File > New > Project
Certain menu options only appear in specific
modes
Solution
Explorer
Solution Explorer
Toolbox
Properties
window
The Solution Explorer
Lists
all files in the solution
Displays the contents or a new project or open file
Start up project runs when the program is
executed
Solution
Explorer toolbar
The Refresh icon reloads files in the solution
The Display icon shows all files, even the
hidden ones
Icons change based on selected file
8
Solution Explorer
Toolbox
Contains
reusable
controls
To display the
Toolbox window,
select VIEW >
Toolbox.
Visual
programming
allows drag and
drop of controls
to customize the
form 10
Fig. 2.17 Toolbox window.
Toolbox
close button
toggle auto hide
mouse over window name
Fig. 2.14 Demonstrating window auto-hide.
11
Properties window
The Properties window (Fig. 2.18)
Manipulate
the properties of a form or control
Properties can include size, color, text, or position
Right
column is the property and left is the value
Icons
arranges the properties alphabetically or by category
The Event icon allows reactions to user actions
Users
12
alter controls visually without writing code
Properties Window
13
Simple Program: Displaying Text
and an Image
The program
Form to hold other controls
Label to display text
PictureBox to display a
picture
No code needed to create
this program
14
Label control
PictureBox
control
Fig. 2.20 Simple program as it executes.
Simple Program: Create the new
program
Project type
Create a new project
Make the project a
windows
application
Name it:
ASimpleProject
and sets its
location
Project name
15
Project location
Creating a new Windows application.
Click to change
project location
Simple Program: Displaying Text
and an Image
The Text property
determines the text in
the title bar
Fig. 2.22 Setting the forms Text property.
16
Simple Program: Resizing the
form
Title bar
grid
Disabled sizing handle
Enabled sizing handle
Form with sizing handles.
17
Simple Program: Selecting color
Current color
Custom palette
Down arrow
Changing property BackColor.
18
Simple Program: Change the
forms color and add a label
New background
color
Adding a new label to the form.
19
Simple Program: Set the labels
text
Text property used
to set the text of a
label
Label can be dragged
to desired location
Or Format > Center
In Form >
Horizontal can
also be used to
position the label as
in in this example
20
Label centered with
updated Text property
Label in position with its Text property set.
Simple Program: Set the labels
font size and align text
The Font property
changes the labels
text
The TextAlign
property to align
the text
Properties window displaying the labels properties.
21
Simple Program: Adding a picture
box
Picture boxes are
used to display
pictures
Drag the picture
box onto the form
Updated
Label
PictureBox
Inserting and aligning the picture box.
22
Simple Program: Inserting an
Image
Insert an image
The
Image property
sets the image that
appears
Pictures should be of
type .gif, .jpeg, or .png
Fig. 2.33 Image property of the picture box.
23
Simple Program: Selecting the
Image
Fig. 2.34 Selecting an image for the picture box.
24
Simple Program: Resizing the
Image
The
picture
box is
resizable to fit
the entire
image
Newly inserted image
(after setting
SizeMode property
to StretchImage)
| PictureBox displaying an image.
25
Simple Program: Saving and
Running
Save the project
In
the Solution Explorer select File > Save
Using Save All will save the source code and
the project
Run the project
In
run mode several IDE features are disabled
Click Build Solution in the Build menu to
compile the solution
Click Debug in the Start menu or press the F5
key
26
Running the Program
Design form
27
Simple Program: Terminating the
program
Click the close button (x in the top
right corner)
Or click the End button in the toolbar
28
29
30
31
32
