Chapter 2 Gaddis Book Dr Scanlan Notes SETTING
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 open an existing Project called Hello. World. • 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.
TEXTBOXES TEXTBOX A Text. Box is used for: 1. Outputting information onto a Form. 2. Inputting data into a program for processing. Typically it is used for inputting data.
Setting Properties Using Property Window Program's Purpose: Illustrates property settings. When the button is pressed, the GUI displays as seen below: Text. Box 1: Don't forget this: Multi. Line: True Text. Align: Center Label 1: Auto. Size: True Font: Microsoft Sans Serif, Bold, 18 points Back. Color: Gray Fore. Color: White Text. Align: Middle. Center Label 2: Auto. Size: False Back. Color: White Fore. Color: Red Border. Style: Fixed 3 D Text. Align: Middle. Center Dr. Scanlan: Program this with the class following. Set text size to 18 points.
Setting Properties Using Property Window Program's Purpose: Illustrates property settings. When the button is pressed, the GUI displays as seen below: Not all t he cod e is sho win g fo r th is li ne. Causes a New. Line to be started. Dr. Scanlan: Program this with the class following. Set text size to 18 points.
TEXTBOXES 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. This string of characters, Hello World, is called DATA.
TEXTBOXES Place “Replace Me” here and it will immediately be seen in the Text. Box. “Replace Me” will be replace with “Hello World” when Button 1 is pressed. See next slide.
TEXTBOXES Press the Button 1 and Hello World replaces “Replace Me”.
TEXTBOXES Text. Boxes: 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 Text. Boxes: MULTILINE
TEXTBOXES How to select a multiline Text. Box: 1. Select the Text. Box 2. Click here
TEXTBOXES How to select a multiline Text. Box (Continued) 3. Click here 4. OR click True here
TEXTBOXES How to select a multiline Text. Box (Continued) 5. RESULTS Multiline Changed from false to true
TEXTBOXES Join or Concatenation uses the & symbol Causes a new line Continuation of a line of code This code will cause the following to be displayed in the multiline Textbox when Button 1 is pressed. >>>>
TEXTBOXES More than one line of text; thus Multiline.
TEXTBOXES Text. Boxes: Border Styles
TEXTBOXES Three different border styles: 1. None 2. Fixed. Single 3. Fixed 3 D
TEXTBOXES Text. Boxes: 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 Text. Boxes: INPUT & OUTPUT
TEXTBOXES Text. Box 1 for INPUT Text. Box 2 for OUTPUT
TEXTBOXES Text. Box 1 for INPUT Text. Box 2 for OUTPUT Set Text. Box 2 for OUTPUT ONLY (Read only) 1. Select Text. Box 2 2. Click here 3. Click here
TEXTBOXES Text. Box 1 for INPUT Text. Box 2 for OUTPUT ONLY Set Text. Box 2 for OUTPUT ONLY (Read only) 4. Select True for Read. Only NOTE: If a Text. Box’s Read. Only property is set to False, the Text. Box can be used to input data into the program or to output data from the program.
TEXTBOXES Place this line of code in the Button 1_Click event. Note: The contents of the Text property in Text. Box 1 will be assigned to the Text property in Text. Box 2. Example: If CSUS is typed into Text. Box 1, CSUS will be displayed in Text. Box 2, when Button 1 is pressed.
TEXTBOXES Steps: 1. Run program 2. Enter CSUS in Text. Box 1 3. Press Button 1 4. View the OUTPUT in Text. Box 2
BUTTONS 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 Button 1 to something different; such as Press.
BUTTONS Buttons: Text ALLIGNMENT
BUTTONS Change message on Button: 1. Select Button 2. If you select “Top. Left”, the word Press will be oriented in the Top. Left of the Button.
LABELS TEXT 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 How to put text in a Label: 1. Get a label from the Tool. Box. 2. Select the label. 3. Replace Label 1 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 Fore. Color from white to Black 2. Replace Label 1 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 Auto. Size to False 4. Change Border. Style to Fixed 3 D 5. Change Fore. Color from White to Black NOTE: Text. Boxes can be used for both input and output. Labels can only be used for output or for labelling.
LABELS
LABELS Press the Button and George Washington is outputted (displayed) in the Label.
LABELS BACKCOLOR 1. Click here and select color.
Setting Properties within the Code SETTING PROPERTIES & METHODS WITHIN THE CODE. Forms, Text. Boxs, and Labels
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: Form 1: Me. Text = "Setting Properties" Text. Box 1: Text. Box 1. Multiline = True Text. Box 1. Size = New Size(128, 60) Text. Box 1. Text. Align = Horizontal. Alignment. Center Text. Box 1. Text = "Hello" & Control. Chars. New. Line & "World" Dr. Scanlan: Program this with the class following. Set text size to 18 points.
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: Label 1: Label 1. Auto. Size = True Label 1. Back. Color = Color. Gray Label 1. Fore. Color = Color. White Label 1. Font = New System. Drawing. Font("Sans Serif", 28) Label 1. Font = New System. Drawing. Font(Label 1. Font, Font. Style. Bold) Label 1. Text = "Hello World" Dr. Scanlan: Program this with the class following. Set text size to 18 points.
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: Label 2: Label 2. Auto. Size = False Label 2. Back. Color = Color. White Label 2. Fore. Color = Color. Red Label 2. Border. Style = Border. Style. Fixed 3 D Label 2. Text. Align = Content. Alignment. Middle. Center Label 2. Size = New Size(128, 22) Label 2. Text = "Hello World" Dr. Scanlan: Program this with the class following. Set text size to 18 points.
Setting Properties Within the Code 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. Text. Box
Setting Properties within the Code Slide: Text. Box 1. Back. Color Purpose: 1. Sets the background color in the Text. Box. Back. Color 1. Set color in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Back. Color = Color. Yellow Text. Box 1. Back. Color = Color. Blue Text. Box 1. Back. Color = Color. Green Text. Box 1. Back. Color = Color. Red 'There are many other colors. 'Use Intellisense.
Setting Properties within the Code Slide: Text. Box 1. Border. Style 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Border. Style = Border. Style. None Text. Box 1. Border. Style = Border. Style. Fixed. Single Text. Box 1. Border. Style = Border. Style. Fixed 3 D
Setting Properties within the Code Slide: Text. Box 1. Font 1. Set in Properties Window
Setting Properties within the Code Slide: Text. Box 1. Fore. Color Purpose: 1. Sets the foreground color in the Text. Box. 2. Result: Fore. Color sets the text color. Fore. Color 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Fore. Color = Color. Yellow Text. Box 1. Fore. Color = Color. Blue Text. Box 1. Fore. Color = Color. Green Text. Box 1. Fore. Color = Color. Red 'There are many other colors. 'Use Intellisense.
Setting Properties within the Code Slide: Text. Box 1. Text Usually this property is left empty and text is added when code is executed. Text 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Text = "Any text here" 'Clears text box Text. Box 1. Text = "" 'Clears text box Text. Box 1. Clear()
Setting Properties within the Code Slide: Text. Box 1. Text. Align 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Text. Align = Horizontal. Alignment. Left Text. Box 1. Text. Align = Horizontal. Alignment. Center Text. Box 1. Text. Align = Horizontal. Alignment. Right
Setting Properties within the Code Slide: Text. Box 1. Character. Casing 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. Character. Casing 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Character. Casing = Character. Casing. Lower Text. Box 1. Character. Casing = Character. Casing. Normal Text. Box 1. Character. Casing = Character. Casing. Upper
Setting Properties within the Code Slide: Text. Box 1. Max. Length Limits how may characters can be entered into the text box : Max. Length: 1 to 32, 767 characters Important for data validation. Max. Length 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Max. Length = "1" Text. Box 1. Max. Length = "10" Text. Box 1. Max. Length = "32767"
Setting Properties within the Code Slide: Text. Box 1. Multi. Line Settings: 1. True: Allows for more than one line of text. 2. False: Limits Text. Box to one line of text. Multi. Line 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Multiline = True Text. Box 1. Multiline = False
Setting Properties within the Code Slide: Text. Box 1 (Location and Size) Location Settings; 1. X: Number of pixels to the left of Form 1 2. Y: Number of pixels from top of Form 1 Size Settings: 1. Width: The width of Text. Box 1 in pixels. 2. Height: The height of Text. Box 1 in pixels. Note: Location and Size are automatically updated when you move Text. Box 1 on the form. All controls that you can see on Form 1 have Location and Size properties. Location and Size 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Location = New Point(80, 40) Text. Box 1. Size = New Size(128, 22)
Setting Properties within the Code Slide: Text. Box 1. Name Property Text. Box 1 is NOT a meaningful name and it must be changed to a name that is meaningful. Rules: 1. Make the name as short as possible and as meaningful as possible. 2. Shift to upper case between words. 3. Use txt as the prefix. Examples: txt. Hours. Worked txt. Last. Name txt. Hourly. Rate txt. Selling. Price Name 1. Set in the Properties Window
Setting Properties within the Code SETTING PROPERTIES & METHODS WITHIN THE CODE. LABELS
Setting Properties within the Code Slide: Label 1. Back. Color Purpose: 1. Sets the background color in the Label. Back. Color 1. Set color in Properties Window OR 2. Set using code by executing one of these: Label 1. Back. Color = Color. Yellow Label 1. Back. Color = Color. Blue Label 1. Back. Color = Color. Green Label 1. Back. Color = Color. Red Label 1. Back. Color = Color. White 'There are many other colors. 'Use Intellisense.
Setting Properties within the Code Slide: Label 1. Border. Style 1. Set in Properties Window OR 2. Set using code by executing one of these: Label 1. Border. Style = Border. Style. None Label 1. Border. Style = Border. Style. Fixed. Single Label 1. Border. Style = Border. Style. Fixed 3 D
Setting Properties within the Code Slide: Label 1. Font 1. Set in Properties Window
Setting Properties within the Code Slide: Label 1. Fore. Color Purpose: 1. Sets the foreground color in the Label. 2. Result: Fore. Color sets the text color. Fore. Color 1. Set in Properties Window OR 2. Set using code by executing one of these: Text. Box 1. Fore. Color = Color. Yellow Text. Box 1. Fore. Color = Color. Blue Text. Box 1. Fore. Color = Color. Green Text. Box 1. Fore. Color = Color. Red 'There are many other colors. 'Use Intellisense.
Setting Properties within the Code Slide: Label 1. Text 1. Set in Properties Window OR 2. Set using code by executing one of these: Label 1. Text = "Any text here" 'Clears text box Label 1. Text = "" 'Clears text box Label 1. Clear()
Setting Properties within the Code Slide: Label 1. Text. Align 1. Set in Properties Window OR 2. Set using code by executing one of these: Label 1. Text. Align = Content. Alignment. Middle. Center Label 1. Text. Align = Content. Alignment. Middle. Left Label 1. Text. Align = Content. Alignment. Middle. Right 'For the six other settings, use intellisense.
Setting Properties within the Code Slide: Label 1 (Location and Size) Location Settings; 1. X: Number of pixels to the left of Form 1 2. Y: Number of pixels from top of Form 1 Size Settings: 1. Width: The width of Label 1 in pixels. 2. Height: The height of Label 1 in pixels. Note: Location and Size are automatically set when you move Label 1 on the form. Location and Size 1. Set in Properties Window OR 2. Set using code by executing one of these: Label 1. Location = New Point(56, 40) Label 1. Size = New Size(160, 16)
Rules for Creating Meaningful Names Slide: Label 1. Name Property Label 1 is NOT a meaningful name and it must be changed to a name that is meaningful. Rules: 1. Make the name as short as possible and as meaningful as possible. 2. Shift to upper case between words. 3. Use lbl as the prefix. Examples: lbl. Display. Hours. Worked lbl. Display. Last. Name lbl. Display. Hourly. Rate lbl. Display. Selling. Price Name 1. Set in the Properties Window
Text. Boxes vs. Labels Text. Boxes • Used for data input. • Used for output, only if you need more than one line. Labels • Used for output
PICTURE BOX PICTUREBOX CONTROL Picture. Box 1. Allows for placing a picture on the form. 2. Has properties, as do most controls. 3. Has events, as do most controls.
PICTURE BOX Purpose: This example program illustrates the Picture. Box 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: lbl. Directions. Visible = True These directions become Visible when the "Display Directions" button is pressed. Dr. Scanlan: Program this with the class following. Set code text size to 18 points.
PICTURE BOX Requirements: 1. Place the objects on the form as seen below. 2. Place the directions in the text property of lbl. Directions. Text 3. Write to code below. When the button is pressed, the label's text property is Displayed. 'THIS CODE IS EXECUTED WHEN THE BUTTON IS PRESSED. [Missing code}
PICTURE BOX Picture. Box Control 1. The Picture. Box allows the programmer to place a picture on the Form. (a) The Picture. Box 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 Picture. Box Control or drag it onto the Form
PICTURE BOX Picture. Box Control 1. Picture. Box Tasks (Options) Picture. Box Control Click here to view options
PICTURE BOX Picture. Box Control 1. Picture. Box Tasks (Options) Find an image to put in the Picture. Box
PICTURE BOX Picture. Box Control 1. Picture. Box 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 Picture. Box Control 1. Picture. Box Tasks (Options) I imported the picture, Hotel. Map, which is displayed. Next, press OK
PICTURE BOX Picture. Box Control 1. Picture. Box Tasks (Options) The Image is now in the Text. Box. 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. Stretch. Image: Allows for sizing the image…Make it big or make it small. Proportions can be changed. 3. Auto. Size: The picture box is sized to the size of the picture. 4. Zoom: Allows for sizing the picture while maintaining is proportions.
VISIBLE PROPERTY Purpose: This program illustrates changing Label 1 from being invisible to visible by pressing a button. Note the code below. Label 1's Visible Property was set to False in the Properties window. Program not running Program running 'CODE EXECUTED BY PRESSING BUTTON 1 Button 1 was pressed
Quick Look at Check. Boxes, Radio. Buttons, and IF-THEN-ELSE The following slides are a brief introduction to Check Boxes, Radio Buttons and IF-THENELSE statements. These topics will be covered in detail in later chapters.
Quick Look at Check. Boxes, Radio. Buttons, and IF-THEN-ELSE STATEMENT Play first two videos for Chapter 4
Quick Look at Check. Boxes, Radio. Buttons, and IF-THEN-ELSE SIMPLE CHECK BOX EXAMPLE Public Class Form 1 'CLICK BUTTON FOR DISCOUNT Private Sub btn. Press_Click(sender As System. Object, e As System. Event. Args) Handles btn. Press. Click If chk. VIPDiscount. Checked = True Then lbl. Display. Discount. Text = "$25. 00" End If End Sub End Class
Quick Look at Check. Boxes, Radio. Buttons, and IF-THEN-ELSE REALISTIC CHECK BOX EXAMPLE Code >>>>
Quick Look at Check. Boxes, Radio. Buttons, and IF-THEN-ELSE CHECK BOX EXAMPLE (CODE) Public Class Form 1 Const VIPDiscount As Decimal = 25 D Const AARPDiscount As Decimal = 15 D 'CALCULATE DISCOUNTS Private Sub btn. Calc. Discount_Click(sender As System. Object, e As System. Event. Args) Handles btn. Calc. Discount. Click If chk. VIPMember. Checked = True And chk. AARP. Checked = True Then lbl. Total. Discounts. Text = Format. Currency(VIPDiscount + AARPDiscount) Else. If chk. VIPMember. Checked = True Then lbl. Total. Discounts. Text = Format. Currency(VIPDiscount) Else. If chk. AARP. Checked = True Then lbl. Total. Discounts. Text = Format. Currency(AARPDiscount) End If End Sub 'CLEAR ENTRIES Private Sub btn. Clear. Entries_Click(sender As System. Object, e As System. Event. Args) Handles btn. Clear. Entries. Click chk. AARP. Checked = False chk. VIPMember. Checked = False lbl. Total. Discounts. Text = "" End Sub LAST SLIDE End Class
Quick Look at Check. Boxes, Radio. Buttons, and IF-THEN-ELSE RADIO BUTTON EXAMPLE -- SIMPLE Public Class Form 1 Const dec. Luxury. Room. Price As Decimal = 275 D Const dec. Standard. Room. Price As Decimal = 125 D 'COMPUTE PRICE Private Sub btn. Compute. Price_Click(sender As System. Object, e As System. Event. Args) Handles btn. Compute. Price. Click If rad. Luxury. Room. Checked = True Then lbl. Display. Price. Text = Format. Currency(dec. Luxury. Room. Price) Else. If rad. Standard. Room. Checked = True Then lbl. Display. Price. Text = Format. Currency(dec. Standard. Room. Price) End If End Sub End Class
- Slides: 87