Programming in C# - City University of New Yorknatacha/TeachSpring_2013/CSC330/... ·...

Preview:

Citation preview

Programming in C#Programming in C#

●● Project 1:Project 1:Set the text in the Form’s title bar.Change the Form’s background color.Place a Label control on the Form.Display text in a Label control.Place a PictureBox control on the Form.

Display an image in a PictureBox control.Run an application.

TestTest--Driving the Driving the WelcomeWelcomeApplicationApplication

Welcome application running.Close box

Constructing the Welcome ApplicationConstructing the Welcome Application

● Changing the Form’s file nameLocate the Solution ExplorerSelect the fileChange the File Name property

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Blank Form.

Toolbar

Form title bar

Form file name

IDE title bar Solution Explorer window

Solution name

Project name

Blank Form

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Changing the Form’s file name.

File properties

New file name

New property value

Selected property description

Selected property

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Changing the Form’s title displayLocate Solution ExplorerSelect the Text propertyChange the text

Setting the Form’s Text property.

Selected property description

Selected property Property value

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Title bar changes to display Form’s Text property

Title bar for the Welcome application.

Title bar

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Form with sizing handles.

Grid

Height

Disabled sizing handle

Mouse pointer over an enabled sizing handle

Enabled sizing handle

Width

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Resizing the Form

Expand the Size propertyChange the WidthChange the Height

Size property values for the Form.

Size property values

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Changing the Form’s background colorLocate the BackColor property

System tab (default)Web tabCustom tab

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Viewing the Custom palette in the Form’s BackColor property value field.

Tabs

Custom colors can be added to the white boxes

Custom palette

Down-arrow ButtonCurrent color

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Custom tab paletteDefine Color dialog

Create your own colorsRGB values

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Adding a color to the Custom palette.

Blue component (169)

Green component (237)

Color preview Red component (255)

Adds a color to Custom palette

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● ToolboxWindows Forms tab

Clicking the Windows Forms tab in the Toolbox.

Windows Forms tab

Label control

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Label added to Form

Adding a Label to the Form.

New background color

Sizing handle (enabled)Label control

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Adding text to the Label

Label’s content changes to reflect new Text value

Label after updating its Text property.

Updated Text property value too large for Label

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Resizing the Label

Text re-aligns to fit new Label size

Label after it has been resized.

Label resized vertically and horizontally

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Moving the Label on the Form

Centered Label.

Centered Label

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Changing the fontLocate Solution ExplorerSelect the Label

Select Font property

Properties window displaying the Label’s properties.

Ellipsis Button

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Font dialogChange text by changing values in dialogs

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Font dialog for selecting fonts, styles and sizes.

Current font

Font dialog

Font sample

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Text alignmentAccess TextAlign propertySelect appropriate option

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Centering the Label’s text.

Top-center alignment option

Text alignment options

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Inserting a pictureSelect the PictureBox control

Drop control onto Form

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Inserting and aligning the PictureBox.

Updated Label

PictureBox

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Changing PictureBox propertiesLocate Solution ExplorerLocate Image property

Image property of the PictureBox.

Image property value (no image selected)

Ellipsis Button

Image preview box (no image currently displayed)

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Selecting the pictureNavigate the Open dialog to the picture locationClick Open

Constructing the Constructing the WelcomeWelcome ApplicationApplication

Open dialog used to browse for a PictureBox image.

bug.png file (may display bugdepending on your settings)

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Resizing the imageChange property SizeMode

StretchImage scales image in PictureBox

Change property Size

Newly inserted image.

PictureBox too small for image

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Previewed image in Image property

Image previewed in the Image property value field.

Previewed image

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Align the imageFormat > Center in Form > Horizontally

Constructing the Constructing the WelcomeWelcome ApplicationApplication

PictureBox displaying an image.

Newly inserted image

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Locking the controlsDisallow accidental resizing and relocation of controls

Locking controls by using the Format menu.

Lock Controls option

Constructing the Constructing the WelcomeWelcome ApplicationApplication

● Running the applicationTitle bar indicates the current application modeDebug > Start

● Closing the running applicationClick the application’s close box

Constructing the Constructing the WelcomeWelcome ApplicationApplication

IDE in run mode, with the application running in the foreground.

IDE title bar displaying [run]

Form (with grid)

Running application

Objects used in the Objects used in the WelcomeWelcomeApplicationApplication

● ComboBox

Located at top of Properties windowDisplays the names and class types of Form and control objects

Component object box expanded to show the Welcome application’s objects.

Welcomeapplication GUI objects

Objects used in the Objects used in the WelcomeWelcomeApplicationApplication

● NamespacesOrganizes classes by functionality Directory-like entitiesSystem.Windows.Forms

The name and class type of an object are displayed in theProperties window’s component object box.

Name of object (Form1) Namespace (System.Windows.Forms)

Class type of object (Form)

Recommended