Distance Learning Center

1
Distance Learning Center

• Lecture 4
• Introduction to Visual Basic
• Programming
• Melissa Lin, IT Consultant
• HenEm, Inc. Parkville, Missouri
• linm_at_ipfw.edu
• http//www.etcs.ipfw.edu/linm

2
Lecture 4

• Review Controls - Text box, Check box, Radio
  button, Group box, Picture box
• Design for the User More Controls
• TabIndex
• ToolTips
• Focus() method
• Keyboard access
• Coding for Controls
• Color
• WithEnd With
• Concatenation
• Example of Multiple Controls (Objects) on a Form
• Summary

3
ReviewMore Controls - Toolbox

• More Controls
• types
• Text box
• Check box
• Radio button
• Group box
• Picture box

4
Designing the User Interface

• To the user, the Interface should be
• Easy to understand
• Familiar
• Comfortable
• Organized
• Readable Fonts
• Color Neutral Overall
• Keyboard Accessible

5
Design User Interface
6
Keyboard Access Keys

• Also referred to as Hot Keys
• Underlined Letter
• User presses Alt underlined letter
• Use Windows-Standard Keys
• Defined using Text Property
• Make sure there are no two controls have the same
  access key.

7
Keyboard Access Keys

• OK Button -Type OK at the Text properties
• Type OKButtone at Name properties
• Exit Button
• Type Exit at the Text properties
• Type exitButton at Name properties

8
Accept Cancel Buttons

• Accept Button
• Identified visually on Form by its darker outline
• Responds to Enter key
• Form's AcceptButton Property
• Cancel Button
• Responds to Esc key
• Form's CancelButton Property

9
Accept and Cancel Button (continue)

• Type OKButton at the AcceptButton propeties
• Type exitButton at the CancelButton properites

10
Focus TabStop

• One control on a Form always has the focus
• Not all control types can receive the focus
• TabStop Property (applicable only for controls
  that are capable of receiving the focus)
• Designates whether a control is allowed to
  receive the focus set to True or False

11
TabIndex Property

• determines the order the focus moves as the Tab
  key is pressed
• Set the TabIndex of the controls (0, 1, 2, etc.)
• Click on each control in sequence to set TabIndex
  property of controls automatically

12
Tab Order

• User should be able to use Tab key to move the
  focus through a form in an organized manner top
  to bottom, left to right
• Use View Menu, Tab Order to set
• TabIndex Property
• Number in tab sequence
• 0 for first control to receive the focus when the
  form loads

13
Forms Screen Location
StartPosition Property Manual
CenterScreen CenterParent WindowsDefaultLocatio
n WindowsDefaultBounds

• Select Center Screen at the Start position

14
ToolTips

• Small label that is displayed when user pauses
  mouse pointer over a control
• Steps for creating ToolTips
• Add a ToolTip Control to Form
• Appears in the Component Tray pane at bottom of
  Form Designer where non-display controls are
  shown
• Select ToolTips on ToolTip1 Property of each
  control and add Tool Tip comments

15
Creating ToolTips (continued)

• Drag
• ToolTip
• control
• and drop
• on the
• form,
• a ToolTip
• control is
• created

16
Creating ToolTips (continued)

• Edit
• Close
• and Exit
• The
• Program at the
• Tooltip1
• Property
• in an Exit
• button

17
Creating ToolTips (continued)

• Place
• Your
• Mouse
• at Exit
• button,
• the
• Tooltip
• Message
• Is
• displayed

18
Coding for Controls

• Clear contents of text boxes and labels
• - Set Text Property equal to an Empty String
• Empty String is 2 quotation marks with no space
  between them ("")
• - Use the Clear Method of a Text Box or set Text
  property to String.Empty
• nameTextBox.Text ""
• dataTextBox.Clear( )
• messageLabel.Text String.Empty
• Set Focus
• - Places the Insertion Point in a Text Box
• - Use the Focus Method
• nameTextBox.Focus( )

19
Coding for Controls (continue)

• Set the Checked Property of CheckBoxes
• and RadioButtons
• - Selects/Deselects Check Box or Radio Button
  at design or run time
• - Set Checked Property True Checked,
  selected
• False Unchecked, deselected
• redRadioButton.Checked True
• displayCheckBox.Checked False
• Visible property
• - Make label invisible
• picFace.Visible False

20
Coding for Controls (continue)

• Change the Color of Objects
• - Use VB Color Constants from the Color Class
• - View complete list in Help
• ForeColor (color of text)
• nameTextBox.ForeColor Color.Red
• BackColor (color of background)
• nameTextBox.BackColor Color.White
• Available Colors
• - Help look up TextObject.Color Property
• Click on SystemDrawing Properties, then click on
  Color Members

21
Available Colors
22
Use the With End With statement

• Changing multiple properties of controls at once
  in code - Use the With End With Statement
• With titleTextBox
• .Visible True
• .ForeColor Color.White
• . Focus( )
• End With

23
Concatenating Text Use an ampersand ()

• Concatenating Text Use an ampersand ()
  preceded and followed by a space between the two
  strings
• messageLabel.Text "Your name is "
• Melissa "
• It displays as Your name is Melissa
• nameAndAddressLabel.Text nameTextBox.Text
  addressTextBox.Text

Space, , then Space
24
Continuing Long Program Lines

• Continuing long program lines
• Use a space and an underscore
• Do not use within parentheses
• The following code works on two lines.
• helloLabel.Text Hello, how are you? _
• I am fine.

Space, then Underscore
Hello, how are you? I am fine.
25
Hands-On Example

• Develop a simple program
• Input name and message
• Change the color of the labels text by selecting
  the color with radio buttons Visible message by a
  check box
• Three buttons display (accept key), clear
  (cancel key), exit with keyboard access keys
• Displaying concatenated input a users name and a
  message in a label
• Place two picture boxes with different size for
  Two different sizes for the logo on the form
• Add a ToolTip to the logo that say Click here
• Save the form
• Save the project
• Run the program

26
Planning GUI Design
frmMessage
Name TextBox
dataEntryGroup
Name
Message
Message TextBox
Color Red Green Blue Black
colorGroup
Message Visible
displayButton
Display

bigPictureBox
clearButton
Clear

exitButton
littlePictureBox
Exit
messageLabel
Click Me
27
Define GUI
28
Planning Object Properties

• Group at top of DataEntry
• Text Name Message Font Default, size to
  fit label box
• Group Color Radio Button
• Name radRed, Text Red, Font Default, size to
  fit label box
• Visible Message - CheckBox
• Text Message Visible Font Default, size to
  fit label box
• Buttons Keyboard Access
• Name btnDisplay. btnClear, btnExit, Text
  Display. clear, Exit, Font Default, size to
  fit label box
• Image
• Name picBig Size as required

29
Define the User Interface - Place Label and
TextBox
30
Define the User Interface (continued)- Place
RadioButton CheckBox
31
Define the User Interface (continued)- Place
Image
32
Select Images
My computer\c\Program Files\Microsoft Visual
Studio.NET 2003\Common7\Graphics\Icons\Computer\Cd
rom01.ico
33
Define the User Interface (continued)- Place
Control on the Form

• Point to ToolTip and drag, drop on the Form
• ToolTip is displayed

34
Define the User Interface (continued)- Place
Control on the Form

• Point to
• Button
• and drag,
• drop on
• the Form,
• resize it

35
Plan the Event Procedures

• Procedure Actions
• displayButton_Click set messageLabel to
  Name, Message
• clearButton_Click Clear two text boxes,
  reset focus
• exitButton_Click Exit the project
• redRadioButton_CheckedChange
• Make the ForeColor messageLabel red
• greenRadioButton_CheckedChange
• Make the ForeColor messageLabel green
• blueRadioButton_CheckedChange
• Make the ForeColor messageLabel blue
• blackRadioButton_CheckedChange
• Make the ForeColor messageLabel black
• bigPictureBox_Click Make
  bigPictureBox visible or not
• littlePictureBox_Click Make
  littlePictureBox visible or not
• visibleCheckBox_CheckedChange Make labels
  visible or not

36
Summary

• Design for the User Interface with more Controls
• TabIndex
• ToolTips
• Focus() method
• Keyboard access
• Coding for Controls
• Color
• WithEnd With
• Concatenation
• Hands On Example of Multiple Controls (Objects)
  on a Form
• Next Write event procedures and more

37
Question?

• Answers
• linm_at_ipfw.edu
• lin_at_ipfw.edu