Graphical User Interface Components Version 1.1. Obectives Students should understand how to use...

24
Graphical User Interface Components Version 1.1

description

These windows controls are discussed in great detail at

Transcript of Graphical User Interface Components Version 1.1. Obectives Students should understand how to use...

Page 1: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Graphical User InterfaceComponents

Version 1.1

Page 2: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Obectives

Students should understand how to use these basic Form componentsto create a Graphical User Interface (GUI) application

FormTextBoxLabelButtonListBoxMessageBoxRichTextBoxMenuStrip

Page 3: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

These windows controls are discussed in great detail at

http://msdn.microsoft.com/en-us/library/k50ex0x9.aspx

Page 4: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

A Form control is created when your GUI application iscreated by Visual Studio. A form encapsulates your mainprogram and provides a frame, title bar with: icon, text, minimize, maximize/restore and close buttons and a client area containing your GUI controls.

Form Control

Page 5: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

TextBox Control

A TextBox control is typically used to get/set a single line oftext from/to the user.

The most important member of a TextBox is its Text property.The Text property of a TextBox control is a getter/setter string object. You can operate (via get/set) on this string just like any other string object.

Page 6: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

TextBox Control Example

Given that the user has typed an integer value into aTextBox control named “Txtjoe” , you could get the integerby writing

int value = int.Parse(Txtjoe.Text);

Note that we use three or four charaters to indicate the typeof control “Txt” in this case.

Page 7: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

TextBox Control Example

Given that you want to output a double value, “money” formattedas currency in a TextBox named “Txtjoe”, you could write Txtjoe.Text = string.Format(“{0:C}”, money);

Page 8: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Label Control

Label controls are typically used to provide descriptive text for a control. For example, you can use a Label to add descriptive text for a TextBoxcontrol to inform the user about the type of data expected. Label controls can also be used to add descriptive text to a Form to provide the user with helpful information. For example, you can add a Label to the top of a Form that provides instructions to the user on how to input data in the controls on the form. Label controls can be also used to output data to your Form.

Page 9: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Label Control Example

Given that you want to output a double value, “money” formattedas currency in a Label named “Lbljoe”, you could write Lbljoe.Text = string.Format(“{0:C}”, money);

Note that the Text property is a getter/setter property of theLabel control.

Page 10: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Button Control

Button controls are typically used to let the user initiate some action.When you click on a Button with the mouse, it generates a Click event.

Page 11: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Button Example

private void BtnTest1_Click(object sender, EventArgs e) { string x = TxtBox1.Text; int num = int.Parse(x); TxtBox2.Text = string.Format("Answer = {0}", num);}

When the Button is clicked, this event handler readsdata from TxtBox1, parses it to an integer, and thenwrites it out to TxtBox2.

Page 12: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

ListBox Control

A ListBox control provides the user with a list of items.An event is generated when one of these items is selected.

You can provide the list if items to be shown at design time,or they can be added at run time using the Add method.

Page 13: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

ListBox Example

private void LstBox1_SelectedIndexChanged(object sender, EventArgs e){ if (listBox1.SelectedIndex != -1) switch (LstBox1.SelectedIndex) { case 0: TxtBox2.Text = "Pizza"; break; case 1: TxtBox2.Text = "Hamburger"; break; case 2: TxtBox2.Text = "Salad"; break; case 3: TxtBox2.Text = "Drink"; break; case 4: TxtBox2.Text = "Hot Dog"; break; case 5: TxtBox2.Text = "Apple Pie"; break; }// end switch}

Page 14: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

MessageBox Control

A MessageBox control displays a Modal Dialog Box some text and optionally a Button and an icon. Message boxes are used to provide feedback information to the user.

You cannot add a MessageBox at design time. Message boxes arecreated by using the method MessageBox.Show( ). There are several forms of this method, for example

// message box with textMessageBox.show(string);

// message box with text and captionMessageBox.Show(string, string);

// message box with text, caption, and buttonsMessageBox.Show(string, string, MessageBoxButtons);

Page 15: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

MessageBoxButtons

* OK The message box contains an OK button.

* OKCancel The message box contains OK and Cancel buttons.

* AbortRetryIgnore The message box contains Abort, Retry, and Ignore buttons.

* YesNoCancel The message box contains Yes, No, and Cancel buttons.

* YesNo The message box contains Yes and No buttons.

* RetryCancel The message box contains Retry and Cancel buttons.

Page 16: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

The response to a MessageBoxButton clickcomes back as a DialogResult.

Page 17: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

MessageBox Example

private void BtnQuit_Click(object sender, EventArgs e){ DialogResult response = MessageBox.Show("Do you really want to quit?",Quit", MessageBoxButtons.YesNo); if (response == DialogResult.Yes) this.Close(); }

Page 18: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

RichTextBox ControlA RichTextBox control displays one or more lines of text are used togive output or receive input from the user.

// Adding text to a RichTextBox ControlRTxt.Append(string);

// Clearing a RichTextBox ControlRTxt.Clear();

Page 19: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Menu Controls

To add a menu bar to your form follow these steps

Page 20: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

(1)Drag a MenuStrip from the tool box onto your form.

Page 21: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

(2) Type then text that you want for the first item on the menu here.

Page 22: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

You can continue to add 1st level menu items

Page 23: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Or add sub-menu items here.

Page 24: Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Create an event handler by double clicking onone of the items in your menu

private void exitToolStripMenuItem1_Click(object sender, EventArgs e) { this.Close();}