OBJECTIVES: To open an existing Project called HelloWorld. To learn how set properties using the property window and how to set them in the code. Chapter 2 Gaddis Book Dr. Scanlan Notes SETTING THE MOST OFTEN USED TEXTBOX, BUTTON, LABEL, PICTUREBOX PROPERTIES, USING THE PROPERIES WINDOW AND CODE.

OBJECTIVES: To learn how set properties using the property window and how to set them in the code using a simple "Hello World" type of program. Chapter 2 Gaddis Book Dr. Scanlan Notes SETTING THE MOST OFTEN USED TEXTBOX, BUTTON, LABEL, PICTUREBOX PROPERTIES, USING THE PROPERIES WINDOW AND CODE.

TEXTBOX A TextBox is used for: 1. Outputting information onto a Form. 2. Inputting data into a program for processing. Typically it is used for inputting data. TEXTBOXES

Setting Properties Using Property Window Program's Purpose: Illustrates property settings. When the button is pressed, the GUI displays as seen below: Dr. Scanlan: Program this with the class following. Set text size to 18 points. TextBox1: MultiLine:True TextAlign: Center Label1: AutoSize: True Font: Microsoft Sans Serif, Bold, 18 points BackColor: Gray ForeColor: White TextAlign: MiddleCenter Label2: AutoSize: False BackColor: White ForeColor: Red BorderStyle: Fixed3D TextAlign: MiddleCenter Don't forget this:

Setting Properties Using Property Window Program's Purpose: Illustrates property settings. When the button is pressed, the GUI displays as seen below: Dr. Scanlan: Program this with the class following. Set text size to 18 points. Not all the code is showing for this line. Causes a NewLine to be started.

FIND AND LOAD YOUR HELLO WORLD PROGAM. START HERE. TEXTBOXES

This is a Textbox OBJECT. This is a PROPERTY of the Textbox OBJECT. TEXTBOXES

This is a Textbox OBJECT. This is a PROPERTY of the Textbox OBJECT. TEXTBOXES This string of characters, Hello World, is called DATA.

“Replace Me” will be replace with “Hello World” when Button1 is pressed. See next slide. Place “Replace Me” here and it will immediately be seen in the TextBox. TEXTBOXES

Press the Button1 and Hello World replaces “Replace Me”. TEXTBOXES

TextBoxes: FORECOLOR & BACKCOLOR TEXTBOXES

How to change the BACKCOLOR of a Textbox: 1. Select the Textbox 2. Click here 3. Click here 4. Click here 5. Click here TEXTBOXES

How to change the FORECOLOR for a Textbox: 1. Select the Textbox 2. Click here 3. Click here 4. Click here 5. Click here TEXTBOXES

TextBoxes: MULTILINE TEXTBOXES

How to select a multiline TextBox: 1. Select the TextBox 2. Click here TEXTBOXES

How to select a multiline TextBox (Continued) 3. Click here 4. OR click True here TEXTBOXES

How to select a multiline TextBox (Continued) 5. RESULTS Multiline Changed from false to true TEXTBOXES

This code will cause the following to be displayed in the multiline Textbox when Button1 is pressed. >>>>>>>> Join or Concatenation uses the & symbol Causes a new line Continuation of a line of code TEXTBOXES

More than one line of text; thus Multiline. TEXTBOXES

TextBoxes: Border Styles TEXTBOXES

Three different border styles: 1.None 2.FixedSingle 3.Fixed3D TEXTBOXES

TextBoxes: Selecting Fonts TEXTBOXES

Click here Next, Click here See next slide for result >>>>> TEXTBOXES

Choose a font then press OK. Three of the many font possibilities. TEXTBOXES

TextBoxes: INPUT & OUTPUT TEXTBOXES

TextBox1 for INPUT TextBox2 for OUTPUT TEXTBOXES

TextBox1 for INPUT TextBox2 for OUTPUT Set TextBox2 for OUTPUT ONLY (Read only) 1. Select TextBox2 2. Click here 3. Click here TEXTBOXES

TextBox1 for INPUT TextBox2 for OUTPUT ONLY Set TextBox2 for OUTPUT ONLY (Read only) 4. Select True for ReadOnly NOTE: If a TextBox’s ReadOnly property is set to False, the TextBox can be used to input data into the program or to output data from the program. TEXTBOXES

Place this line of code in the Button1_Click event. Note: The contents of the Text property in TextBox1 will be assigned to the Text property in TextBox2. Example: If CSUS is typed into TextBox1, CSUS will be displayed in TextBox2, when Button1 is pressed. TEXTBOXES

Steps: 1. Run program 2. Enter CSUS in TextBox1 3. Press Button1 4. View the OUTPUT in TextBox2 TEXTBOXES

Buttons BACKCOLOR & FORECOLOR BUTTONS

How to change the BACKCOLOR of a Button: 1. Select the Button 2. Click here 3. Click here 4. Click here 5. Click here BUTTONS

How to change the FORECOLOR of a Button: 1. Select the Button 2. Click here 3. Click here 4. Click here 5. Click here BUTTONS

Buttons: TEXT BUTTONS

Change message on Button: 1. Select Button 2. Change Button1 to something different; such as Press. BUTTONS

Buttons: Text ALLIGNMENT BUTTONS

Change message on Button: 1. Select Button 2. If you select “TopLeft”, the word Press will be oriented in the TopLeft of the Button. BUTTONS

Labels 1. Labels can be used as labels. 2. Labels can be used to output data from the code. 3. Labels can never be used to input data. LABELS TEXT LABELS

How to put text in a Label: 1. Get a label from the ToolBox. 2. Select the label. 3. Replace Label1 with new text, such as, Name. See next slide for results>>>>>>> LABELS

How to use a label as a label on a form. 1. Change ForeColor from white to Black 2. Replace Label1 with Name or any word/s you want. LABELS

How to use a label for Output: 1. Drag a Label onto the Form. 2. Select the Label 3. Change AutoSize to False 4. Change BorderStyle to Fixed3D 5. Change ForeColor from White to Black NOTE: TextBoxes can be used for both input and output. Labels can only be used for output or for labelling. LABELS

Press the Button and George Washington is outputted (displayed) in the Label. LABELS

BACKCOLOR 1. Click here and select color. LABELS

SETTING PROPERTIES & METHODS WITHIN THE CODE. Forms, TextBoxs, and Labels Setting Properties within the Code

Setting Properties Within the Code Program's Purpose: Illustrates property settings within the code. When the button is pressed, the GUI displays as seen below: Dr. Scanlan: Program this with the class following. Set text size to 18 points. Form1: Me.Text = "Setting Properties" TextBox1: TextBox1.Multiline = True TextBox1.Size = New Size(128, 60) TextBox1.TextAlign = HorizontalAlignment.Center TextBox1.Text = "Hello" & ControlChars.NewLine & "World"

Setting Properties Within the Code Program's Purpose: Illustrates property settings within the code. When the button is pressed, the GUI displays as seen below: Dr. Scanlan: Program this with the class following. Set text size to 18 points. Label1: Label1.AutoSize = True Label1.BackColor = Color.Gray Label1.ForeColor = Color.White Label1.Font = New System.Drawing.Font("Sans Serif", 28) Label1.Font = New System.Drawing.Font(Label1.Font, FontStyle.Bold) Label1.Text = "Hello World"

Setting Properties Within the Code Program's Purpose: Illustrates property settings within the code. When the button is pressed, the GUI displays as seen below: Dr. Scanlan: Program this with the class following. Set text size to 18 points. Label2: Label2.AutoSize = False Label2.BackColor = Color.White Label2.ForeColor = Color.Red Label2.BorderStyle = BorderStyle.Fixed3D Label2.TextAlign = ContentAlignment.MiddleCenter Label2.Size = New Size(128, 22) Label2.Text = "Hello World"

Dr. Scanlan: Program this with the class following. Set text size to 18 points. Setting Properties Within the Code

SETTING PROPERTIES & METHODS WITHIN THE CODE. TextBox Setting Properties within the Code

Slide: TextBox1.BackColor BackColor 1.Set color in Properties Window OR 2.Set using code by executing one of these: TextBox1.BackColor = Color.Yellow TextBox1.BackColor = Color.Blue TextBox1.BackColor = Color.Green TextBox1.BackColor = Color.Red 'There are many other colors. 'Use Intellisense. Purpose: 1.Sets the background color in the TextBox.

Slide: TextBox1.BorderStyle BorderStyle 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.BorderStyle = BorderStyle.None TextBox1.BorderStyle = BorderStyle.FixedSingle TextBox1.BorderStyle = BorderStyle.Fixed3D Setting Properties within the Code

Slide: TextBox1.Font Font 1.Set in Properties Window Setting Properties within the Code

Slide: TextBox1.ForeColor ForeColor 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.ForeColor = Color.Yellow TextBox1.ForeColor = Color.Blue TextBox1.ForeColor = Color.Green TextBox1.ForeColor = Color.Red 'There are many other colors. 'Use Intellisense. Purpose: 1.Sets the foreground color in the TextBox. 2.Result: ForeColor sets the text color. Setting Properties within the Code

Slide: TextBox1.Text Text 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.Text = "Any text here" 'Clears text box TextBox1.Text = "" 'Clears text box TextBox1.Clear() Usually this property is left empty and text is added when code is executed. Setting Properties within the Code

Slide: TextBox1.TextAlign TextAlign 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.TextAlign = HorizontalAlignment.Left TextBox1.TextAlign = HorizontalAlignment.Center TextBox1.TextAlign = HorizontalAlignment.Right Setting Properties within the Code

Slide: TextBox1.CharacterCasing CharacterCasing 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.CharacterCasing = CharacterCasing.Lower TextBox1.CharacterCasing = CharacterCasing.Normal TextBox1.CharacterCasing = CharacterCasing.Upper Changes inputted text to: 1.Normal: Stays as typed 2.Upper: Forces text to upper case 3. Lower: Forces text to lower case Important for data validation. Setting Properties within the Code

Slide: TextBox1.MaxLength MaxLength 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.MaxLength = "1" TextBox1.MaxLength = "10" TextBox1.MaxLength = "32767" Limits how may characters can be entered into the text box : MaxLength: 1 to 32,767 characters Important for data validation. Setting Properties within the Code

Slide: TextBox1.MultiLine MultiLine 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.Multiline = True TextBox1.Multiline = False Settings: 1.True: Allows for more than one line of text. 2.False: Limits TextBox to one line of text. Setting Properties within the Code

Slide: TextBox1 (Location and Size) Location and Size 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.Location = New Point(80, 40) TextBox1.Size = New Size(128, 22) Location Settings; 1.X: Number of pixels to the left of Form1 2.Y: Number of pixels from top of Form 1 Size Settings: 1.Width: The width of TextBox1 in pixels. 2.Height: The height of TextBox1 in pixels. Note: Location and Size are automatically updated when you move TextBox1 on the form. All controls that you can see on Form1 have Location and Size properties. Setting Properties within the Code

Slide: TextBox1.Name Name 1.Set in the Properties Window Name Property TextBox1 is NOT a meaningful name and it must be changed to a name that is meaningful. Rules: 1.Make the name as short as possibleand as meaningful as possible. 2.Shift to upper case between words. 3.Use txt as the prefix. Examples: txtHoursWorked txtLastName txtHourlyRate txtSellingPrice Setting Properties within the Code

SETTING PROPERTIES & METHODS WITHIN THE CODE. LABELS

Slide: Label1.BackColor BackColor 1.Set color in Properties Window OR 2.Set using code by executing one of these: Label1.BackColor = Color.Yellow Label1.BackColor = Color.Blue Label1.BackColor = Color.Green Label1.BackColor = Color.Red Label1.BackColor = Color.White 'There are many other colors. 'Use Intellisense. Purpose: 1.Sets the background color in the Label. Setting Properties within the Code

Slide: Label1.BorderStyle BorderStyle 1.Set in Properties Window OR 2.Set using code by executing one of these: Label1.BorderStyle = BorderStyle.None Label1.BorderStyle = BorderStyle.FixedSingle Label1.BorderStyle = BorderStyle.Fixed3D Setting Properties within the Code

Slide: Label1.Font Font 1.Set in Properties Window Setting Properties within the Code

Slide: Label1.ForeColor ForeColor 1.Set in Properties Window OR 2.Set using code by executing one of these: TextBox1.ForeColor = Color.Yellow TextBox1.ForeColor = Color.Blue TextBox1.ForeColor = Color.Green TextBox1.ForeColor = Color.Red 'There are many other colors. 'Use Intellisense. Purpose: 1.Sets the foreground color in the Label. 2.Result: ForeColor sets the text color. Setting Properties within the Code

Slide: Label1.Text Text 1.Set in Properties Window OR 2.Set using code by executing one of these: Label1.Text = "Any text here" 'Clears text box Label1.Text = "" 'Clears text box Label1.Clear() Setting Properties within the Code

Slide: Label1.TextAlign TextAlign 1.Set in Properties Window OR 2.Set using code by executing one of these: Label1.TextAlign = ContentAlignment.MiddleCenter Label1.TextAlign = ContentAlignment.MiddleLeft Label1.TextAlign = ContentAlignment.MiddleRight 'For the six other settings, use intellisense. Setting Properties within the Code

Slide: Label1 (Location and Size) Location and Size 1.Set in Properties Window OR 2.Set using code by executing one of these: Label1.Location = New Point(56, 40) Label1.Size = New Size(160,16) Location Settings; 1.X: Number of pixels to the left of Form1 2.Y: Number of pixels from top of Form 1 Size Settings: 1.Width: The width of Label1 in pixels. 2.Height: The height of Label1 in pixels. Note: Location and Size are automatically set when you move Label1 on the form. Setting Properties within the Code

Slide: Label1.Name Name 1.Set in the Properties Window Name Property Label1 is NOT a meaningful name and it must be changed to a name that is meaningful. Rules: 1.Make the name as short as possibleand as meaningful as possible. 2.Shift to upper case between words. 3.Use lbl as the prefix. Examples: lblDisplayHoursWorked lblDisplayLastName lblDisplayHourlyRate lblDisplaySellingPrice Rules for Creating Meaningful Names

TextBoxes vs. Labels TextBoxes Used for data input. Used for output, only if you need more than one line. Labels Used for output

PictureBox 1. Allows for placing a picture on the form. 2. Has properties, as do most controls. 3. Has events, as do most controls. PICTUREBOX CONTROL PICTURE BOX

Purpose: This example program illustrates the PictureBox property. It also illustrates the Visual property of a Label that has been set to False in the Properties window and set to True in the code. Code: lblDirections.Visible = True Dr. Scanlan: Program this with the class following. Set code text size to 18 points. These directions become Visible when the "Display Directions" button is pressed.

PICTURE BOX 'THIS CODE IS EXECUTED WHEN THE BUTTON IS PRESSED. When the button is pressed, the label's text property is Displayed. [Missing code} Requirements: 1.Place the objects on the form as seen below. 2.Place the directions in the text property of lblDirections.Text 3.Write to code below.

PICTURE BOX PictureBox Control 1. The PictureBox allows the programmer to place a picture on the Form. (a)The PictureBox can respond to a variety of events, such as a click event. 2.These slides illustrate: (a) Placing a picture on the form. (b) A click event causing a message to be displayed. Double click on the PictureBox Control or drag it onto the Form

PICTURE BOX PictureBox Control 1. PictureBox Tasks (Options) Click here to view options PictureBox Control

PICTURE BOX PictureBox Control 1. PictureBox Tasks (Options) Find an image to put in the PictureBox

PICTURE BOX PictureBox Control 1. PictureBox Tasks (Options) Find (Import) an image and place it in the Resources.resx file that is under the Solutions.sln File. Press Import button to look for your desired Picture.

PICTURE BOX PictureBox Control 1. PictureBox Tasks (Options) I imported the picture, HotelMap, which is displayed. Next, press OK

PICTURE BOX PictureBox Control 1. PictureBox Tasks (Options) The Image is now in the TextBox. You have four Options: 1. Normal: The full size of the image is displayed and you can use the handles to display all or part of the picture. 2. StretchImage: Allows for sizing the image…Make it big or make it small. Proportions can be changed. 3. AutoSize: The picture box is sized to the size of the picture. 4. Zoom: Allows for sizing the picture while maintaining is proportions.

VISIBLE PROPERTY 'CODE EXECUTED BY PRESSING BUTTON1 Program not runningProgram runningButton1 was pressed Purpose: This program illustrates changing Label1 from being invisible to visible by pressing a button. Note the code below. Label1's Visible Property was set to False in the Properties window.

Quick Look at CheckBoxes, RadioButtons, and IF-THEN-ELSE The following slides are a brief introduction to Check Boxes, Radio Buttons and IF-THEN- ELSE statements. These topics will be covered in detail in later chapters.

Quick Look at CheckBoxes, RadioButtons, and IF-THEN-ELSE IF-THEN-ELSE STATEMENT Play first two videos for Chapter 4

Quick Look at CheckBoxes, RadioButtons, and IF-THEN-ELSE Public Class Form1 'CLICK BUTTON FOR DISCOUNT Private Sub btnPress_Click(sender As System.Object, e As System.EventArgs) Handles btnPress.Click If chkVIPDiscount.Checked = True Then lblDisplayDiscount.Text = "$25.00" End If End Sub End Class SIMPLE CHECK BOX EXAMPLE

Quick Look at CheckBoxes, RadioButtons, and IF-THEN-ELSE REALISTIC CHECK BOX EXAMPLE Code >>>>

Quick Look at CheckBoxes, RadioButtons, and IF-THEN-ELSE CHECK BOX EXAMPLE (CODE) Public Class Form1 Const VIPDiscount As Decimal = 25D Const AARPDiscount As Decimal = 15D 'CALCULATE DISCOUNTS Private Sub btnCalcDiscount_Click(sender As System.Object, e As System.EventArgs) Handles btnCalcDiscount.Click If chkVIPMember.Checked = True And chkAARP.Checked = True Then lblTotalDiscounts.Text = FormatCurrency(VIPDiscount + AARPDiscount) ElseIf chkVIPMember.Checked = True Then lblTotalDiscounts.Text = FormatCurrency(VIPDiscount) ElseIf chkAARP.Checked = True Then lblTotalDiscounts.Text = FormatCurrency(AARPDiscount) End If End Sub 'CLEAR ENTRIES Private Sub btnClearEntries_Click(sender As System.Object, e As System.EventArgs) Handles btnClearEntries.Click chkAARP.Checked = False chkVIPMember.Checked = False lblTotalDiscounts.Text = "" End Sub End Class LAST SLIDE

Public Class Form1 Const decLuxuryRoomPrice As Decimal = 275D Const decStandardRoomPrice As Decimal = 125D 'COMPUTE PRICE Private Sub btnComputePrice_Click(sender As System.Object, e As System.EventArgs) Handles btnComputePrice.Click If radLuxuryRoom.Checked = True Then lblDisplayPrice.Text = FormatCurrency(decLuxuryRoomPrice) ElseIf radStandardRoom.Checked = True Then lblDisplayPrice.Text = FormatCurrency(decStandardRoomPrice) End If End Sub End Class Quick Look at CheckBoxes, RadioButtons, and IF-THEN-ELSE RADIO BUTTON EXAMPLE -- SIMPLE