1. 1

2. Objectives Plan an application Complete a TOE Chart
Use a text box control
Explain the difference between a primary window and a dialog box
Follow the Windows standards regarding the layout and labeling of controls
Microsoft Visual Basic .NET: Reloaded

3. Objectives (continued)
Align and size controls
Follow the Windows standards regarding the use of graphics, fonts, and color
Assign access keys to controls
Set the tab order
Designate a default button and a cancel button
Microsoft Visual Basic .NET: Reloaded

4. Planning an Application
Microsoft Visual Basic .NET: Reloaded

5. SKATE-AWAY Sales Overview of current processes
Sells skateboards by phone
Priced at $100 each
Available in yellow and blue
Salespeople record order info on a form
Customer name, address, number ordered of each color
Manually calculates total number ordered, total price including tax
Very time consuming
Microsoft Visual Basic .NET: Reloaded

6. Creating a OE Chart TOE Chart (Task, Object, Event) Steps involved
Identify the tasks
Identify the objects
Identify the events
Microsoft Visual Basic .NET: Reloaded

7. Identifying the Application’s Tasks
Microsoft Visual Basic .NET: Reloaded

8. Identifying the Application’s Tasks (continued)
What information, if any, does application need for display on the screen and/or print on the printer?
Display on screen
Customer’s name, street address, city, state Zip Code, number of each color skateboards ordered, total skateboards ordered, and total price of the order
Print to printer
nothing
Microsoft Visual Basic .NET: Reloaded

9. Identifying the Application’s Tasks (continued)
What information, if any, will the user need to enter into user interface to display and/or print desired information?
Customer’s name
Street address
City
State
ZIP code
Number of blue and yellow skateboards
Microsoft Visual Basic .NET: Reloaded

10. Identifying the Application’s Tasks (continued)
What information, if any, will the application need to calculate to display and/or print the desired information?
Total number of skateboards ordered
Total price of each order
How will the user end the application?
Application will include an Exit button
Will previous information need to be cleared from the screen before new information is entered?
Order information will need to be cleared
Microsoft Visual Basic .NET: Reloaded

11. Identifying the Application’s Tasks (continued)
Microsoft Visual Basic .NET: Reloaded

12. Identifying the Objects
Text box control
Gives user an area in which to enter data
Instantiated using the Textbox tool
Button control
User clicks to terminate the application
Label control
Displays information you do not want user to change while application is running
Microsoft Visual Basic .NET: Reloaded

13. How To…
Microsoft Visual Basic .NET: Reloaded

14. Identifying the Objects (continued)
Assign appropriate object to each task
Microsoft Visual Basic .NET: Reloaded

15. Identifying the Events
No special event is necessary for text boxes
Events needed for buttons
Microsoft Visual Basic .NET: Reloaded

16. Completed TOE Chart by Object
Microsoft Visual Basic .NET: Reloaded

17. Designing the User Interface
Primary Window
Area where primary viewing and editing of your application takes place
Dialog boxes
Used to support and supplement a user’s activities in primary window
Example: font dialog box allows specification of font utilized in primary window
Microsoft Visual Basic .NET: Reloaded

18. Designing the User Interface (continued)
Microsoft Visual Basic .NET: Reloaded

19. Designing the User Interface (continued)
Setting the border style of a form
Microsoft Visual Basic .NET: Reloaded

20. Arranging the controls
Information should flow vertically, or horizontally
Most important information should be located in top-left corner of screen
Vertical flow should be top to bottom
Horizontal flow should be left to right
Essential information should be in first row
Microsoft Visual Basic .NET: Reloaded

21. Arranging the controls (continued)
Vertical arrangement example
Microsoft Visual Basic .NET: Reloaded

22. Arranging the controls (continued)
Horizontal arrangement example
Microsoft Visual Basic .NET: Reloaded

23. Arranging the controls (continued)
Punctuation tips:
Use Sentence capitalization for text boxes
Capitalize only first word and any words normally capitalized
Use book title capitalization for buttons
Capitalize the first letter in each word except for articles, conjunctions, and prepositions that do not occur at either the beginning or the end of the caption
Sizing tips:
Size controls relative to each other
Microsoft Visual Basic .NET: Reloaded

24. Aligning and Sizing Controls
Format menu options
Align
Allows aligning 2 or more controls by left, right, top, and bottom
Make Same Size
Allows 2 or more controls to be size to same width and/or height
Microsoft Visual Basic .NET: Reloaded

25. Arranging the controls (continued)
Selecting controls to align
Microsoft Visual Basic .NET: Reloaded

26. Arranging the controls (continued)
Controls aligned by left border
Microsoft Visual Basic .NET: Reloaded

27. Including Graphics in the User Interface
Only include graphics when necessary
Use to emphasize or clarify
Use for aesthetic purposes
Use for a personal touch to application
Be sure graphics are not a distraction
Place in a corner
Microsoft Visual Basic .NET: Reloaded

28. Including Different Fonts in the User Interface
Font Property
Use to change type, style, and size
Font
General shape of characters in the text
Measured in points
One point = 1/72 of an inch
May be serif or sans serif
Serif is a light cross stroke appearing at top or bottom of a character
Tahoma font recommended for Windows 2000 and Windows XP
Microsoft Visual Basic .NET: Reloaded

29. Including Color in the User Interface
Use color sparingly
Best to use black text on white or off-white background - limit colors to no more than 3
Points to keep in mind:
Some users will have monochrome monitors
Users may have varying degrees of color-blindness
Color is subjective
Pretty to you is hideous to someone else
Colors have different meanings for different cultures
Microsoft Visual Basic .NET: Reloaded

30. Designing Access Keys Access key
Allows user to select object using Alt key in combination with a letter or number
Allows user to work with application even if mouse becomes inoperative
Allows fast typists to keep hands on the keyboard
Allows people with disabilities, which may prevent them from using mouse, to use the application
Assign by including & (ampersand) in control’s caption
Microsoft Visual Basic .NET: Reloaded

31. Designing Access Keys (continued)
Microsoft Visual Basic .NET: Reloaded

32. Setting the TabIndex Property
TabIndex property determines order in which a control receives focus
A control with focus can accept user input
Order in which controls added to form originally determines order of TabIndex
First control added to form has a TabIndex of 0, second control 1, third control 2, etc.
Microsoft Visual Basic .NET: Reloaded

33. Setting the TabIndex Property (continued)
Steps to determine appropriate tab order:
List controls which can accept user input
List should reflect order the user will want to access controls
Assign each control in list with a TabIndex value beginning with 0
Microsoft Visual Basic .NET: Reloaded

34. Setting the TabIndex Property (continued)
Microsoft Visual Basic .NET: Reloaded

35. Setting the TabIndex Property (continued)
Setting tab order via Tab Order option of View Menu
Place mouse over first control you want in the tab order and crosshairs appear
Microsoft Visual Basic .NET: Reloaded

36. Setting the TabIndex Property (continued)
Click each control and tab order changes in numerical order
Microsoft Visual Basic .NET: Reloaded

37. Designing Default and Cancel Buttons
Default button
Selected by clicking it or pressing Enter key
Specify by setting AcceptButton property of form
Cancel button
Selected by clicking or pressing the Esc key
Specify by setting CancelButton property of form
Microsoft Visual Basic .NET: Reloaded

38. Designing Default and Cancel Buttons (continued)
Microsoft Visual Basic .NET: Reloaded

39. Programming Example - Moonbucks Coffee
Create a user interface that allows user to enter the following customer information:
Name
Address
City
State
ZIP code
Pounds of regular coffee ordered
Pounds of decaffeinated coffee ordered
The interface will need to display total pounds of coffee ordered and the total order price
Microsoft Visual Basic .NET: Reloaded

40. TOE Chart
Microsoft Visual Basic .NET: Reloaded

41. User Interface
Microsoft Visual Basic .NET: Reloaded

42. Objects, Properties, and Settings
Microsoft Visual Basic .NET: Reloaded

43. Objects, Properties, and Settings (continued)
Microsoft Visual Basic .NET: Reloaded

44. Tab Order
Microsoft Visual Basic .NET: Reloaded

45. Code
Microsoft Visual Basic .NET: Reloaded

46. Summary Plan application jointly with user
Use TOE chart to identify tasks, objects, and events
Text box control allows user to enter data
Primary window supports viewing and editing of application’s data
BorderStyle property sets borders of form and dialog boxes
Microsoft Visual Basic .NET: Reloaded

47. Summary (continued)
Organize information to flow vertically or horizontally (top to bottom, left to right)
Maintain consistent size, spacing, and margins when placing controls on form
Align borders of controls whenever possible
Graphics and color should be used sparingly
Microsoft Visual Basic .NET: Reloaded

48. Summary (continued)
Set TabIndex property to set tab order of user input controls
Assign access keys to controls
AcceptButton property of form sets default button (Enter key)
CancelButton property of form sets cancel button (Esc key)
Microsoft Visual Basic .NET: Reloaded