G RAPHICAL U SER I NTERFACE C ONCEPTS : P ART 2 1 Outline Control Properties and Layout Label s, TextBox es and Button s GroupBox es and Panel s CheckBox es and RadioButton s PictureBox es

C OMMON C ONTROL P ROPERTIES Derive from class Control Name, Text, Font, BackColor properties Enable property - Indicate a control’s accessibility TabIndex property Order in which controls are given focus Automatically set by Visual Studio.NET Visible property method Hide sets Visible to false Doesn’t have to be disable to be hidden Focus method Transfers the focus to a control and make it active 2

C ONTROL L AYOUT P ROPERTIES Anchor property Anchors control to a constant distance from specified parent container control Docking allows control to spread itself along and entire side Dock property Allows a control to spread itself along an entire side of parent container DockPadding property (for parent containers) Size property for forms Allow for specifying size range MinimumSize and MaximumSize property 3

C ONTROL P ROPERTIES AND L AYOUT 4 Anchoring demonstration. Constant distance to left and top sides Before resizeAfter resize

C ONTROL P ROPERTIES AND L AYOUT 5 Manipulating the Anchor property of a control. Darkened bar indicates to which wall control is anchored Click down-arrow in Anchor property to display anchoring window

C ONTROL P ROPERTIES AND L AYOUT 6 Docking demonstration. Control expands along top portion of the form

L ABELS, T EXT B OXES AND B UTTONS Labels Derived from class Control Font, Text and TextAlign Properties Textbox Text, ReadOnly, ScrollBars, Multiline properties PasswordChar property - altering it makes textbox a Password textbox TextChanged event (default) Button Derived from ButtonBase Text property Click Event (default) 7

55 /// Required method for Designer support - do not modify 56 /// the contents of this method with the code editor. 58 private void InitializeComponent() 82 // inputPasswordTextBox 84 this.inputPasswordTextBox.Location = 85 new System.Drawing.Point( 16, 16 ); 86 this.inputPasswordTextBox.Name = 87 "inputPasswordTextBox"; 88 this.inputPasswordTextBox.PasswordChar = '*'; 89 this.inputPasswordTextBox.Size = 90 new System.Drawing.Size( 264, 20 ); 91 this.inputPasswordTextBox.TabIndex = 0; 92 this.inputPasswordTextBox.Text = ""; 8 Set the Name, PasswordChar and Text properties for inputPasswordTextBox

9 displayPasswordLabel.Text = inputPasswordTextBox.Text;

G ROUP B OXES AND P ANELS Containers to arrange components on a GUI All controls contained within move together when container is moved GroupBox es can display a caption determined by Text property Controls property (list of controls contained) Panel s can have scrollbar used in running and designing form AutoScroll property (Default is false) BorderStyle property (Default is None) Controls property (list of controls contained) 10

G ROUP B OX ES AND P ANEL S 11 Creating a Panel with scrollbars. Controls inside panel panel panel scrollbars

12 hiButton_Click leftButton_ClickrightButton_Click DEMO

C HECKBOXES AND R ADIO B UTTONS Two Types of State buttons On/off (true/false state) Derived from class ButtonBase CheckBox No restriction on usage RadioButton Grouped together Only one can be true Mutually exclusive options Text property – text displayed to right of button (label) Checked property – indicates whether button has been checked CheckChanged event (default event) 13

14 15 private System.Windows.Forms.CheckBox boldCheckBox; 16 private System.Windows.Forms.CheckBox italicCheckBox; 18 private System.Windows.Forms.Label outputLabel; 31 // make text bold if not bold, if already bold make not bold 33 private void boldCheckBox_CheckedChanged( 34 object sender, System.EventArgs e ) 35 { 36 outputLabel.Font = 37 new Font( outputLabel.Font.Name, 38 outputLabel.Font.Size, 39 outputLabel.Font.Style ^ FontStyle.Bold ); 40 } // make text italic if not italic, 43 // if already italic make not italic 44 private void italicCheckBox_CheckedChanged( object sender, System.EventArgs e ) 46 { 47 outputLabel.Font = new Font( outputLabel.Font.Name, outputLabel.Font.Size, 50 outputLabel.Font.Style ^ FontStyle.Italic ); 51 } Font constructor takes in the font name, size, and style Style is a member of the FontStyle enumeration Style property itself is read-only Style can use bitwise operators When program start, both Checkbox are unchecked

15 C HECK B OX T EST. CS P ROGRAM O UTPUT Result when bold is selected Result when both styles are selected

16 1 // RadioButtonsTest.cs 2 // Using RadioButtons to set message window options. 3 4 //using statements go here; // form contains several radio buttons--user chooses one // from each group to create a custom MessageBox 15 private System.Windows.Forms.Label promptLabel; 16 private System.Windows.Forms.Label displayLabel; 17 private System.Windows.Forms.Button displayButton; private System.Windows.Forms.RadioButton questionButton; 20 private System.Windows.Forms.RadioButton informationButton; 21 private System.Windows.Forms.RadioButton exclamationButton; 22 private System.Windows.Forms.RadioButton errorButton; 23 private System.Windows.Forms.RadioButton retryCancelButton; 24 private System.Windows.Forms.RadioButton yesNoButton; 25 private System.Windows.Forms.RadioButton yesNoCancelButton; 26 private System.Windows.Forms.RadioButton okCancelButton; 27 private System.Windows.Forms.RadioButton okButton; 28 private System.Windows.Forms.RadioButton 29 abortRetryIgnoreButton; private System.Windows.Forms.GroupBox groupBox2; 32 private System.Windows.Forms.GroupBox groupBox1; 33 private MessageBoxIcon iconType = MessageBoxIcon.Error; private MessageBoxButtons buttonType = MessageBoxButtons.OK; To store user’s choice of options iconType is created. Object iconType is a MessageBoxIcon enumeration The enumeration name indicate which button to display Label is used to prompt userLabel is used to display which button was pressed Display the text DisplayRadioButtons are created for the enumeration options One event handling exists for all the radio buttons in groupBox1 and groupBox2

17 // change button based on option chosen by sender private void buttonType_CheckedChanged( object sender, System.EventArgs e ) { if ( sender == okButton ) // display OK button buttonType = MessageBoxButtons.OK; // display OK and Cancel buttons else if ( sender == okCancelButton ) buttonType = MessageBoxButtons.OKCancel; // display Abort, Retry and Ignore buttons else if ( sender == abortRetryIgnoreButton ) buttonType = MessageBoxButtons.AbortRetryIgnore; // display Yes, No and Cancel buttons else if ( sender == yesNoCancelButton ) buttonType = MessageBoxButtons.YesNoCancel; // display Yes and No buttons else if ( sender == yesNoButton ) buttonType = MessageBoxButtons.YesNo; // only one option left--display Retry and Cancel buttons else buttonType = MessageBoxButtons.RetryCancel; } // end method buttonType_CheckedChanged Each radio button generates a CheckedChanged when clicked Handlers compare the sender object with every radio button to determine which button was selected

18 // change icon based on option chosen by sender private void iconType_CheckedChanged( object sender, System.EventArgs e ) if ( sender == errorButton ) // display error icon iconType = MessageBoxIcon.Error; else if ( sender == exclamationButton ) iconType = MessageBoxIcon.Exclamation; // display information icon else if ( sender == informationButton ) iconType = MessageBoxIcon.Information; else // only one option left--display question mark iconType = MessageBoxIcon.Question; } // end method iconType_CheckedChanged // display MessageBox and button user pressed protected void displayButton_Click( object sender, System.EventArgs e ) { DialogResult result = MessageBox.Show( "This is Your Custom MessageBox.", "Custom MessageBox", buttonType, iconType, 0, 0 ); Handlers compare the sender object with every radio button to determine which button was selected Click handler for displayButton creates a MessageBox Result of message box is a DialogResult enumeration

19 // check for dialog result and display it in label switch ( result ) { case DialogResult.OK: displayLabel.Text = "OK was pressed."; break; case DialogResult.Cancel: displayLabel.Text = "Cancel was pressed."; break; case DialogResult.Abort: displayLabel.Text = "Abort was pressed."; break; case DialogResult.Retry: displayLabel.Text = "Retry was pressed."; break; case DialogResult.Ignore: displayLabel.Text = "Ignore was pressed."; break; case DialogResult.Yes: displayLabel.Text = "Yes was pressed."; break; case DialogResult.No: displayLabel.Text = "No was pressed."; break; } // end switch } // end method displayButton_Click The result input will help determine which text to display among the cases

20 Exclamation icon type Error icon type OKCancel button type OK button type Radio button style allow user to select one per column

21 AbortRetryIgnore button type RetryCancel button type Information icon type Question icon type YesNoCancel button type YesNo button type

P ICTURE B OXES Class PictureBox Displays an image Common properties The Image property sets the Image object to use SizeMode property sets how the image is displayed Default event is click 22

23 private System.Windows.Forms.PictureBox imagePictureBox; private System.Windows.Forms.Label promptLabel; // form to display different images when clicked public class PictureBoxTest : System.Windows.Forms.Form { private int imageNum = -1; // change image whenever PictureBox clicked private void imagePictureBox_Click( object sender, System.EventArgs e ) { imageNum = ( imageNum + 1 ) % 3; // imageNum from 0 to 2 // create Image object from file, display on PictureBox imagePictureBox.Image = Image.FromFile( Directory.GetCurrentDirectory() + "\\images\\image" + imageNum + ".bmp" ); } } // end class PictureBoxTest PictureBox imagePicture use to display one of three bitmap images Includes instructions Click On Picture Box to View Images To respond to the Click eventStore the image we want to displayModulus calculation insures that number is between 0 and 2 Set the Image property of imagePictureBox to an Image Method FromFile which takes a string and creates an Image object Method GetCurrentDirectory of Class Directory returns current directory of file as a string Use imageNum to append the correct number

24