bim313 – advanced programming simple controls 1. contents traditional controls – labels, text...

35
BIM313 – Advanced Programming Simple Controls 1

Upload: erika-quinn

Post on 26-Dec-2015

223 views

Category:

Documents


1 download

TRANSCRIPT

BIM313 – Advanced Programming

Simple Controls

1

Contents

• Traditional Controls– Labels, Text Boxes, Buttons, Check Boxes, List

Boxes, Combo Boxes• Advanced Controls– Timers, Tabbed Dialog Boxes, Image Lists, List

View, Tree View• Menus• Toolbars• Scrolbars

2

Labels

• Label controls are used to display static text to the user.

• The user can’t change a static text directly but you can change the text with code.

• Labels are most often used to provide descriptive text for other controls such as text boxes.

• Labels are also great for providing status-type information to a user, as well as for providing general instructions on a form.

3

Manipulating Labels

• Give meaningful names to the labels.

• You can specify the text of the label by changing its Text property.

• To create a multiline label, click in the Text property to display a drop-down arrow and then click the arrow to access a text editor, as shown on the right.

• In most cases, it’s best to place label text on a single line, but it’s nice to have the option.

4

Specifying a Hotkey

• A label can have an associated hotkey.• A hotkey appears as an underlined character in the

label’s text, as in First Name:.• When the user presses the Alt key in conjunction with

the hotkey (Alt+F in this example), the focus is moved to the next control in the tab order after the label.

• To assign a hotkey to a label, you preface the hotkey in the label’s Text property with an ampersand (&). For example, to create the F hotkey for the First Name label, you would enter the following into the Text property of the label: &First Name:.

5

Text Box

• A Label control is usually the best control for displaying text that a user can’t change.

• However, when you need to allow users to enter or edit text, the text box is the tool for the job.

• If you’ve ever typed information on a form, you’ve almost certainly used a text box.

6

A Label and a Text Box

7

Text Alignment

• Both the Text Box and Label controls have a TextAlign property (as do many other controls).

• The TextAlign property determines the alignment of the text within the control, much like the justification setting in a word processor.

• You can select from Left, Center, and Right.• Exercise: Try these alignments in the label and the

text box.

8

Multiline Text Box

• By default, you can change the width of a text box but you can’t change its height.

• Because, the text box is defined as a single-line text box.

• If you set the Multiline property of a text box to True, you can change the height.

9

Shortcut Menu

• You can change the Multiline property using the Properties window as well as using the shortcut menu of the text box.

• Just select the text box and click the little square with an arrow that appears above the text box.

• Most controls have such a shortcut menu, but the contents depend on the type of the selected control. 10

Disabling a Text Box

• There will be times when you don’t want a user to be able to interact with a control.

• The Enabled property, which almost every control has, determines whether the user can interact with the control.

• When you disable a text box, the text appears in gray rather than black, and the text box doesn’t accept the focus or allow you to change the text.

11

A Disabled Text Box

12

Adding Scrollbar to a Text Box

• By changing the value of the ScrollBars property of a text box, you can give the text box scrollbars.

• The ScrollBars property takes the values None, Vertical, Horizontal, or Both.

• Some notes:– Only multiline text boxes can display scrollbars.– If WordWrap property of the text box is true and the

ScrollBars property is set to Both then the horizontal scrollbar is never shown because the text always wrap to fit the control.

13

A Text Box with Vertical ScrollBar

14

AcceptsReturn and AcceptsTab Properties

• If you set a text box’s AcceptsReturn property to true, the user can press Enter to create a new line in the text box (otherwise pressing Enter key activates the default button).

• When the AcceptsTabs property is set to true, the user can press Tab within the control to create columns (rather than moving the focus to the next control).

15

Limiting the Number of Characters in a Text Box

• You can limit how many characters a user can type into a text box by using the MaxLength property.

• Default value for MaxLength is 32767.• The MaxLength property is most often used

when the text box’s content is to be written to a database, in which field sizes are usually restricted.

16

Creating Password Fields

• Assign a character to the PasswordChar property.

• If you assign an asterisk (*) then all letters are shown as an asterisk.

• Although the user doesn’t see the actual text contained in the text box, referencing the Text property in code always returns the true text.

17

• A text box displays password characters only if its Multiline property is set to False.

Text Box’s Common Events

• TextChanged: Occurs every time the user presses a key or pastes text into the text box.

• Click: Occurs when the user clicks the text box.• MouseDown: Occurs when the user first presses

a mouse button over the text box.• MouseUp: Occurs when the user releases a

mouse button over the text box.• MouseMove: Occurs when the user moves the

mouse pointer over the text box.

18

OK and Cancel Buttons

• Generally, every dialog boxes has an OK and a Cancel buttons.

• OK button accepts the user’s values and closes the form.• Cancel button closes the form discarding the user’s

values.• If you set the DialogResult property of a Button object

to OK, then the form is closed when the button is clicked.

• ShowDialog() method of the form returns the DialogResult value of the button.

19

Accept Button

• When creating dialog boxes, it’s common to assign one button as the default button (called the Accept button).

• If a form has an Accept button, that button’s Click event is fired when the user presses Enter, regardless of which control has the focus.

• Accept button can be set by selecting a button from the AcceptButton property of the form.

20

Cancel Button

• A Cancel button fires its Click event when the user presses the Esc key (as opposed to the Enter key), regardless of which control has the focus.

• Generally, you place code in a Cancel button to shut down the form without committing any changes the user made.

• Cancel button can be set by selecting a button from the CancelButton property of the form.

21

Check Boxes

• A check box is used to display true/false and yes/no values on a form.

• The CheckState property of the check box determines whether the check box is checked.

• The Checked property of check box takes values true or false.

• The CheckState property of check box takes the values Checked, Unchecked, or Indeterminate.

• Set ThreeState property to true if you want to allow three check states rather than two.

22

Panels and Group Boxes

• Controls can be placed on a form because the form is a container object—an object that can host controls.

• Some controls act as containers as well, and a container can host one or more other containers.

• The Panel and Group Box controls are both container controls that serve a similar purpose.

• Group box control is generally used for grouping the radio buttons.

23

Differences Between Group Box and Panel

• The Panel control is a slimmed-down version of the GroupBox control.

• Panel has no border and caption feature.• Panel has scrolling capabilities but GroupBox

has not.

24

Radio Buttons

• Radio buttons are mutually exclusive to the container on which they’re placed.

• This means that only one radio button per container can be selected at a time.

• Selecting one radio button automatically deselects any other radio buttons on the same container.

• Exercise: Put a GroupBox into the Options form and drag some radio buttons on it.

25

Options Form

26

List Boxes

• A list box is used to present a list of items to a user.

• You can add items to, and remove items from, the list at any time with very little Visual C# code.

• You can set up a list box so that a user can select only a single item or multiple items.

• When a list box contains more items than it can show because of the control’s size, a scrollbar appears automatically.

27

Combo Box

• A combo box looks like a text box with a down-arrow button on its right side.

• Clicking a combo box’s button causes the control to display a drop-down list box.

• Working with the list of a combo box is pretty much identical to working with a list box.

28

Manipulating Items in Design Time

• The Items property of a list box can be used to manipulate the items.

• When you select the Items property in the Properties window, a button with three dots appears.

• When you click the button, a String Collection Editor is opened.

• You can enter the items into the editor.

29

String Collection Editor

30

Manipulating Items at Runtime

• Adding items: Use the Add() method of the Items property of the list box.lstAlbums.Items.Add("The Division Bell");

• Inserting items: Use Insert() method:lstAlbums.Items.Insert (0, "The Division Bell");

• Removing items: Use Remove() method:lstAlbums.Items.Remove("The Division Bell");lstAlbums.Items.RemoveAt(0);

• Clearing the list: Use Clear() method:lstAlbums.Items.Clear();

31

Information About the Selected Item

• Two properties provide information about the selected item: SelectedItem and SelectedIndex.

• SelectedItem returns the selected string. If no item is selected, an empty string is returned.

• SelectedIndex returns the index of the selected item. Indices start from zero. If no item is selected, -1 is returned.

32

Exercise

• Create a new project and add two list boxes in the main form.

• Add some items into the first list box.• Add two buttons between the list boxes.– One of the button removes the selected item from

the first one and adds it to the second one.– The other button work in reverse of the other.

33

Sorting a List

• List boxes and combo boxes have a Sorted property.

• Changing this property value to True causes Visual C# to sort the contents of the list alphabetically.

• All items added using the Add() method or the Insert() method are automatically inserted into the proper sorted location.

34

More on Combo Boxes

• Items collection of combo boxes behaves exactly like that of list boxes.

• Combo boxes have the Text property. The value of the selected item is placed in this property.

• Combo box allows the user to enter any text in the text portion of the control.

• Exercise: Examine the DropDownStyle and AutoCompleteSource properties.

35