Hour 5


During this hour you will learn

Creating Menus for User Ease

Menus are part of nearly every Windows application that you buy. Even when the application is equipped with a toolbar, those toolbar buttons are nothing more than shortcuts that duplicate menu actions. Clicking the Print toolbar button is often faster than choosingPrint from the File menu and then clicking OK; however, menus provide more choices than will fit on a toolbar and provide a standard interface to most Windows programs.

Fortunately, Visual Basic lets you create menus without programming. VB creates completely interactive pull-down menus that respond to user selections. Your job, as you'll learn in this hour, requires only that you determine the menu bar item names and specify which options (or submenus) appear on each menu bar item; Visual Basic does the rest, creating a working menu for your application.

Topic 1: The Menu Editor

Visual Basic's Menu Editor is the tool you use for creating your application's menus. This topic section teaches you how to use the Menu Editor to build menus. When you learn the fundamentals, the next topic explains how to assign events and code to menu options.

FAST TRACK
Are you familiar with Microsoft's Menu Editor? Visual Basic 5's Menu Editor hasn't changed significantly from earlier versions. If you've used menu editors in previous editions, or in Visual C++ or Visual J++, you can move on to Hour 6's lesson.

Almost every application you create will have menus. Menus require no programming to create, but you'll have to write program code that executes when users select from your menus.

Overview

If you want to make your users at home with your application, supply a menu. The closer your menu matches that of other Windows programs, the more quickly your users will adapt to your application. Therefore, if you place a program termination option on your application's menu bar, use the industry standard Exit option on theFile menu instead of something like a Quit option on the Tools menu.

The words on your menus comprise your application's menu bar. Normally, the words that appear on the menu bar aren't menu items, but menu names. If you click one of these menu names, you get a pull-down menu with two or more items. You can think of these items as command buttons that support only one event-the Click event. Because the only event related to menus is Click, your programming job is simple. You'll focus most of this hour mastering the Menu Editor because responding to menu events is straightforward. (Even a keyboard-triggered menu selection triggers the Click event.)


Recent Microsoft applications turn the menu bar into a kind of push-button bar as you pass the mouse pointer over the menu items. In other words, if you move your mouse over Visual Basic's Edit menu name, the word Edit becomes a button that you can click. The button appearance helps you know when you've selected the correct menu and helps reduce errors that result from clicking between two items and selecting the wrong choice.
Unfortunately, Visual Basic's Menu Editor doesn't support this menu item push-button feature. Perhaps Microsoft will add the push-button look to Visual Basic's next version.

Introducing the Menu Editor Window

The Menu Editor is a dialog box that helps you design and create menus. Surprisingly, Microsoft hasn't changed the Menu Editor much in several years. (The Menu Editor has existed in many Microsoft products, including previous versions of Visual Basic and Visual C++.) The length of time that Microsoft has used the Menu Editor, and that the Menu Editor has remained relatively unchanged, is a testament to the Menu Editor's ease and power.

Menus appear on forms. Your application can contain a single form or multiple forms. You can place a menu on any or all of the forms. You can't access the Menu Editor until you display a form in your Form window. The Menu Editor then creates a menu for that form.


The Menu Editor makes it easy to change your mind. If you don't like the menu that you created, you can change it. You easily can add or remove menu items later as your application's needs change.

To invoke the Menu Editor, choose Menu Editor from theTools menu; press Ctrl+E; or click the toolbar's Menu Editor button. Figure 5.1 shows the Menu Editor.

Figure 5.1

Create and edit menus in the Menu Editor.

Menu control properties

Menu control list box

The top half of the Menu Editor, called the Menu control properties area, lets you set specific properties about your menu items and the overall menu bar. The large blank area at the bottom of the Menu Editor, the Menu control list box, displays the current menu structure as you build the menu. Table 5.1 describes the options you'll find on the Menu Editor.

Table 5.1 The Menu Editor's Options

Option

Description

Caption

The menu item name that you want to appear on the menu bar

Name

A control name that you assign to each menu item

Index

A value you assign if you create a menu control array, which lets you work with multiple menu items simultaneously through programming code

Shortcut

The Ctrl-keystroke combination that triggers the current menu item

HelpContextID

A reference value that lets you connect online help to each menu item

NegotiatePosition

A reference value that determines how and where the menu item falls within a special container form, where you can store a repository of controls

Checked

An option that determines whether a check mark appears to the left of menu items (choose Toolbars from VB's View menu for an example)

Enabled

An option that determines whether the menu option is temporarily disabled (indicated by the option being grayed out)

Visible

An option that determines whether the menu item is now visible or hidden on the menu

WindowList

An MDI (Multiple Document Interface) option that determines whether the menu contains open MDI forms

Arrow buttons

Controls that let you change the indention level of selected menu items

Next

A command button that moves the selected menu item in the Menu control list box to the next line

Insert

A command button that lets you insert new menu items between two existing items

Delete

A command button that lets you remove menu items you no longer want

One of the best ways to learn the Menu Editor is to use it. The following example builds an imaginary menu structure. Because the menu you build isn't going to conform to any Windows menu bar standards, you can concentrate on the Menu Editor and not worry about programming details.

Example

Create a new project so that you can practice with the Menu Editor. Choose Standard EXE from the New Project dialog box; Visual Basic creates the sample form named Form1 for you. For this example, don't worry about renaming the form because you'll discard it after you're done.

Table 5.2 describes the menu structure you're going to create in this example.

Table 5.2 The Example's Menu Structure

Menu Name

Menu Option

Name

Event Procedure

Fly

mnuFly
Fly

Delta

mnuFlyDelta mnuFlyDelta_Click
Fly

American

mnuFlyAmerican mnuFlyAmerican_Click
Fly

United

mnuFlyUnited mnuFlyUnited_Click
Fly

Southwest

mnuFlySouthwest mnuFlySouthwest_Click
Drive

mnuDrive
Drive

Truck

mnuDriveTruck mnuDriveTruck_Click
Drive

Car

mnuDriveCar mnuDriveCar_Click
Drive

Tractor

mnuDriveTractor
mnuDriveTractor_Click








At first, you may not understand how all of Table 5.2's columns work together to create a menu, but they make sense when you think of how menu structures often appear:


Search Visual Basic's Books Online for Menu Title and Naming Guidelines for additional menu option naming conventions you should follow.


Although the menu item and event names are lengthy, you'll be able to remember them when you begin programming their events because their names describe exactly which menu bar items and options they refer to.

Follow these steps to create a menu with the Menu Editor:

  1. Type Fly in the Caption field.
  2. Type mnuFly in the Name field.
  3. Click the Next button without entering other Menu Editor values, because the Fly menu bar item is already complete. Notice that clicking Next moves the highlight bar down the Menu control list box area.
  4. Type Delta for the next Caption and mnuFlyDelta for the name and click Next. Your Menu Editor window should now look like the one in Figure 5.3.

Figure 5.2

The sample menu is taking shape.


Don't be confused that you didn't type Fly again for the Menu Name. Fly is a menu bar item, but Delta won't be after you fix the menu in a later step.

  1. Click OK to see the menu as it appears so far (see Figure 5.3).

Figure 5.3

The menu bar as it appears so far.

  1. Because Delta is directly beneath Fly in the Menu Editor's control list box area, Visual Basic thinks Delta is a menu bar item instead of a submenu item (as you can see by the menu bar shown in Figure 5.3). However, Delta is supposed to appear as an option on Fly's pull-down menu. Indentation tells the Menu Editor which items are menu bar items and which are submenu items. If you indent Delta to the right, the Menu Editor knows that Delta is a submenu item for Fly.
  2. Open the Menu Editor again and click the row with Delta.
  3. Click the right arrow button. The Menu Editor indents Delta to the right, showing that Delta is now a submenu item under Fly.
  4. If you ever need to turn a submenu item into a menu bar item, click the left arrow's button to move that submenu item up to the menu bar. Also, the up and down arrow buttons move items up or down the menu without changing the item's subornation to other menu items. You can also use the Insert and Delete buttons (as explained in Table 5.1) to insert and delete items from the menu. Next simply moves the highlight down the list.
  5. Continue building the menu with Table 5.2's entries until you've added all the Fly submenu items. Your Menu Editor window should look like the one in Figure 5.4.

Figure 5.4

You've now entered all the first menu's items.

  1. With the highlight in the new position under your menu items, click the left arrow button to move the subordination up a level so you can enter the second menu bar item.
  2. Type Drive in the Caption text box and mnuDrive in the Name text box. Make sure that Drive aligns with Fly at the left of the Menu Editor, so they both appear on the menu bar.
  3. Enter the rest of the menu items. When you finish, your Menu Editor should look like Figure 5.5. Make sure that your Menu Editor's indention matches that of Figure 5.5's. If you've added a blank, indented menu item at the bottom of the Menu Editor, highlight the blank item and click Delete.

Figure 5.5

You've completed the menu structure.

Next Step

You've built your first menu structure! Click OK to see the menu bar on the form. Menu design is simple because VB activates the menu while you work at program design time; that way, you can see what users will see when the application runs. To test your menu, click Drive to see Drive's pull-down menu (see Figure 5.6). You can drag the mouse up and down the menu to see what happens when you run the application.

Figure 5.6

You can review your menu while working inside the development environment.

To review, each menu item-whether on the menu bar or on a submenu-has a caption and name. If you indent the item in the Menu Editor window's list box, Visual Basic puts the item on a submenu for the most recent menu bar entry.

Topic 2: Responding to Menus

Each time users select a submenu item, a Windows Click event occurs. You're responsible for writing the event procedure code that responds to your menu options. If you ran the sample application that you created in the previous topic section, nothing would happen because no event procedures appear in the code.

Overview

In this topic section, you'll add code for the menu items. As with most of this lesson, you may not understand all the code details that you put in the menu's event procedures, but that's fine for now. The next major part of this course, "Programs that Do Work," explores the Visual Basic language in depth. This part of your training simply gives you the overall "big picture" so that you'll learn, hands-on, how to operate inside the Visual Basic environment and how VB program components go together to create a working application.

The Menu Events

Although Table 5.2 listed the event procedures needed to respond to the menu item selections, you never typed one of the event procedure names during the creation of the menu. The Menu Editor doesn't deal with event procedures. Remember, the Code window is where you type and edit all event procedures. The Menu Editor's job is simply to help you design and create the menu bar and its options.

You generate the name for each menu option's event procedure every time you name a menu option. The only event procedure for a menu option is the Click event, so as soon as you enter the menu item name in the Menu Editor, you've indirectly specified the name of the event procedure for that item. Therefore, the event procedure for the Car option on the Drive menu is mnuDriveCar_Click because the name of the option (if you followed Table 5.2 when you created the sample menu) is mnuDriveCar. The only event available for menus is Click.

The following example explains how to open the Code window so that you can add executable code to make the menu options work.

Example

Opening the Code window for a specific menu item event procedure is simple. From your Form window, display a pull-down submenu and click the item whose event procedure you want to write. For example, if you click the menu bar's Fly option, you'll see the submenu. Clicking United opens the mnuFlyUnited_Click procedure shown in Figure 5.7's Code window. Just as VB opens the Code window when you double-click a form's controls, Visual Basic opens the Code window for menu items when you select those items from within the form window.

Figure 5.7

Visual Basic prepares to receive the menu code.

Press the space bar to indent the first line of code that you enter and type the following for the United event procedure:

Dim Msg As String, Title As String, Style As Integer

Msg = "You chose United"

Title = "United Air"

Style = vbOKOnly

Response = MsgBox(Msg, Style, Title)

The second, third, and fourth lines set up a message box, a pop-up window that displays messages in Windows applications. (You'll learn about message boxes in Hour 9's lesson, "Interactive Keyboard and Screen I/O.") The fourth line displays the message box on-screen.

Close the Code window and run the application. Choose United from the Fly menu; Visual Basic displays the message box shown in Figure 5.8. After you verify that the event procedure works, you can create event procedures for the remaining items, if you want. Click OK in the message box to return to the running application, and then close the application so that you can work on the application's design again.

Figure 5.8

The menu selection triggered the code.


Copy the event procedure's code body to the Clipboard. When you click the other menu options to add event procedures from the Form window, you can paste the Clipboard into the Code window. The only change you have to make is to the airline name or the type of driving vehicle.

Next Step

The menu doesn't look anything like a standard Windows menu because I wanted you to concentrate on menu-building specifics, not on menu items themselves. Nevertheless, you'll gain additional practice if you add a File menu-bar item with an Exit option to end the application. You'll then have a graceful way to exit the application without clicking the Close window button; you'll also gain additional Menu Editor practice.

Follow these steps to add the File menu and Exit option:

  1. Open the Menu Editor again. The highlight will rest on the menu bar's Fly option.
  2. Click the Insert button to insert a new menu item before Fly.
  3. Enter File in the Caption text box and mnuFile for the Name. Make sure that the Menu Editor is inserting the File entry with no indentation, because File is to be a menu-bar item.
  4. Click Next to save the File entry and open a new entry below File.
  5. Type Exit for the Caption and mnuFileExit for the Name.
  6. Click the right arrow while Exit is still highlighted to turn it into File's submenu option.
  7. Click OK to see the resulting menu. Now you need to add the Exit option's procedure code.
  8. Choose Exit from the File menu to open the mnuFileExit_Click event procedure. (You'll see your other menu event procedures as well.)
  9. Indent two spaces and type End so that your entire event procedure looks like this:
Private Sub mnuFileExit_Click()

  End

End Sub

  1. The End command, as you might remember from Hour 4's lesson, terminates the running program.
  2. Close the Code window and run the program. Display a few menu message boxes and then choose Exit from the File menu to terminate the program.

Your menu isn't quite finished because no shortcut keys exist. The Menu Editor supports several other options, such as hot keys, shortcut keys, and separating lines. You learn about those menu extras in the following topic section.

Topic 3: Advanced Menu Options

Although you can now create menus, the Visual Basic Menu Editor supports several additional menu features that you can add to your applications. You want to make your application as easy as possible for your users. Therefore, you'll want to give your users many options. By providing hot keys, shortcut keys, and cascading menus, you can help add a professional touch to your applications-plus, you'll gain the users' respect.

Overview

This topic section explains how to add hot keys and shortcut keys to your menus as well as use checked, enabled, and other attributes on your submenu items. Specifying these extras requires little more than clicking the correct option for that entry in the Menu Editor.

Hot Keys

In Windows, it's common to use keystroke combinations instead of mouse manipulation to accomplish some tasks. For example, to save a file, you can either choose Save from the File menu of most applications, or press Alt+F+S. These key combinations are called hot keys or accelerator keys. A menu item's underlined character indicates the hot key. Thus, the File menu's hot key is Alt+F; if you press Alt+F in most Windows applications, Visual Basic opens the File menu.

As with command button hot keys (as discussed in Hour 4), you only need to place an ampersand (&) before the hot-key letter in the menu item's caption. When you run the application, you'll see that Visual Basic assigned the underlined hot key to that letter. When you develop Visual Basic applications, you can add hot keys to make your menus easier to traverse.


If you don't assign a hot key to a menu item, Visual Basic uses the item's first letter as the hot key. Therefore, if you display the Fly menu and press the letter A, Visual Basic selects the American option, even if you haven't turned the A in American into a hot key.

Shortcut Keys

Similar to hot keys are the shortcut keys. You've already mastered shortcut keys for command buttons; when you press Alt plus a command button's underlined letter, you trigger that command button's Click event. By adding shortcut keys to menu items, you eliminate the users' need to display a menu-bar menu to choose an option. When you add shortcut keys to menu items, Visual Basic lists the shortcut keystroke on the menu so that your users can more quickly learn the shortcut key.

You'll optionally designate a shortcut key for your menu's items inside the Menu Editor in the next example.


Hot keys are used to navigate the menus; shortcuts bypass the menus. A properly designed menu must have a hot key for each menu item so that users can effectively navigate through the menu options with the keyboard instead of the mouse. Shortcuts, however, are generally reserved for most-used commands; they're easier than hot keys to remember and to key in, but assigning them to every menu item would be overkill.


Most current Windows applications place a toolbar button's icon next to the matching menu item so you can learn the buttons that go with the menu options. Therefore, if you open Visual Basic'sFile menu, you'll see icons on the menu that correspond to matching toolbar icons. Unfortunately, Visual Basic doesn't yet support menu icons in the Menu Editor, so your applications will contain menus that have shortcut keystrokes but can't display icons.

Other Critical Features

A few other Menu Editor features appear that you can now master. The check boxes labeled Checked, Enabled, and Visible determine the default value for the menu when a form is loaded.Checked means that a check mark appears beside the menu option when users display the submenu. Enabled (the default is enabled) means that the option is available and not grayed out. Visible (the default is visible) means that the option appears in the menu when the application starts.

During the application's execution, your program might change one or more of these menu properties. For example, if no data exists to print but you normally provide a Print option on a File menu, you may want to gray out the option until users enter data that your program can print.


Programmers can disable or hide temporarily unavailable menu options. Generally when an option isn't currently available, users appreciate seeing the option grayed out rather than find that the option has disappeared. If you hide unavailable options, users can more easily forget where that option is when you make the option visible again. By graying out an option, users know that the option is available but just not now.

You'll use the HelpContextID option when you add online help to your application. (Hour 29's lesson, "Building a Help Subsystem," explains how to add online help to menus.) The Index, NegotiatePosition, and WindowList options are useful only in special situations. You can check the online help if you want to know more about these rarely used menu options.


One of the most helpful style modifications you can apply to your menus is a separator line that separates groups of menu options from one another. On Visual Basic's File menu you'll see seven lines that separate the parts of the menu form one another. To add separator lines, simply type a hyphen (-) for the Caption value and add a unique name, such as mnuSep1, to each separator line that you create. When you run the application, Visual Basic won't let you choose the separator line; VB uses the separator line just to group menu options.

Example

Follow these steps to add hot keys to the File menu name and the Exit option:

  1. Open the Menu Editor.
  2. Click the File entry if File isn't highlighted in the bottom of the Menu Editor.
  3. Click the F in the Caption text box to insert the text cursor before the word File.
  4. Press the ampersand key to make the F the hot key.
  5. Click the Exit entry.
  6. Make the letter x the Exit option's hot key. (The Windows standard always makes x the Exit hot key on the File menu.)
  7. You can now add a shortcut key to one of the other menu options for practice. Highlight the Car entry.
  8. Open the Shortcut drop-down list (see Figure 5.9).

Figure 5.9

Select a shortcut key from the list.

The shortcut key list

  1. Select Ctrl+C for the shortcut key.
  2. Click OK to close the Menu Editor.
  3. Run the application.
  4. Press the Ctrl+C shortcut keystroke to simulate the Drive menu's Car option. The Car message box should appear.
  5. Press Alt+F to open the File menu, and then press the X letter key to exit the program.

Next Step

Cascading menus are submenus within submenus. The Windows Start menu is a great cascading menu model because when you select one menu, another usually pops up next to it. The Menu Editor can easily create cascading menus. All you need to do is indent, with the right arrow button, the subordinate menus.

Add the following submenu options to the Fly menu's Delta option:

Follow these steps to add the new options:

  1. Open your Menu Editor if you don't have it open already.
  2. Click the American entry.
  3. Click the Insert command button to insert a blank area for a new menu option before the American entry.
  4. Click the right arrow to indent the option more than the Delta entry. Indented options that fall under Delta will be subordinate to Delta; therefore, they will comprise Delta's submenu.
  5. Type L1011 for the Caption and mnuFlyDeltaL1011 for the Name.
  6. Click Next and Insert to open a new option. Type MD88 for the Caption and mnuFlyDeltaMD88 for the Name. Be sure to indent the entry directly under the previous one.
  7. Click Next and Insert to open a new option. Type 747 for the Caption and mnuFlyDelta747 for the Name. Be sure to indent the entry directly under the previous one.
  8. Click OK to close the Menu Editor.
  9. You now have to correct a possible problem. If you were to run the application and choose Delta from the Fly menu, you wouldn't see the new submenu! Remember that you've written an event procedure for mnuFlyDelta_Click(), and that event procedure will override the submenu.
  10. From Visual Basic's View menu choose Code to display the Code window for your event procedures.
  11. Delete the lines that comprise the mnuFlyDelta_Click() event procedure (you may have to scroll the window to see the procedure). Select the lines (highlight them by clicking and dragging your mouse from the start of the procedure to its final character) and press Delete to remove the event procedure.
  12. Close the Code window and run the application. The Fly menu shows a triangle next to Delta that indicates that a submenu appears from that option. When you choose Delta from the Fly menu, you'll see your new cascading submenu, which should look something like the one in Figure 5.10.

Figure 5.10

A menu option can produce additional submenus.

Summary

Your Visual Basic applications aren't complete until you add menu bars to them. Fortunately, the Menu Editor makes adding menus simple because you design, create, and edit your application's menus directly inside the Menu Editor. You don't have to know how to program to create menus, but you'll need to add event procedure code to the menu selections to activate the menus.

FAST TRACK
Have you seen pop-up menus that appear when you right-click over an item? You'll learn in Hour 23's lesson, "Enhancing Your Program," how to create pop-up menus.

This hour's lesson ends Part 1 of your night-school training. In Hour 6 you'll begin to study the details of the Visual Basic programming language. Now that you've seen the fundamentals of Visual Basic development, the Visual Basic commands that you learn in the next part are needed before you can tackle additional controls. (Many of the Visual Basic form controls require runtime programming before you can use them.)

Hour 5 Quiz

  1. What event corresponds to the selection of a menu item if users click the mouse to select from the menu?
  2. What event corresponds to the selection of a menu item if users use the keyboard to select from the menu?
  3. True or false: You can design your menu as well as enter event procedure code with the Menu Editor.
  4. What's the difference between the Visible and Enabled options in the Menu Editor?
  5. What does the name of the menu item do?
  6. What's the difference between a hot key and a shortcut key?
  7. What's the purpose of the Checked option in the Menu Editor?
  8. What is a cascading menu?
  9. Which has priority-a cascading submenu or an event procedure?
  10. Describe how to open a menu bar option's Code window from the development environment.

Hour 5 Homework Exercises

  1. You didn't get a chance to use the Menu Editor's up and down arrows to rearrange menu options. Use the up and down arrow buttons to reverse the Fly and Drive menu options.
  2. Extend the Delta menu three more levels.

Although this exercise is great practice, you normally don't want to cascade four or five levels. Generally, three levels are the most you should ever include. If you need more levels, you should probably add additional menu bar options to eliminate some nested menu levels.

  1. Write a program that creates the same menu structure that's in the Windows Paint program. By working through this entire menu, including the shortcut keys and hot keys, you'll know the Menu Editor inside and out. Be sure to add separator lines where needed to group related menu options together as Paint does.


© 1997, QUE Corporation, an imprint of Macmillan Publishing USA, a Simon and Schuster Company.