- Defining the Menus in XM
- Invoking the MenuBuilder Framework
- Adding Menu Features
Adding Menu Features
You may notice in the figures here, or in the book's code, that the menus I've created have added features:
- There's a horizontal separator line in the Help menu.
- The Show Tips option is a toggle.
- The Check for Updates option is disabled.
- The options have keyboard equivalents.
All of these features can be specified in the XML file as well.
A separator is just an element with a type attribute whose value is separator:
<menuItem type="separator" />
The default type value is normal, which never needs to be specified. The third possible type is check, which allows a menu item to be checked (or not), as in the Show Tips example:
<menuItem label="Show Tips" type="check" toggled="false" />
The initial toggled value of false indicates that when the application first loads, the item should not be marked as checked.
To disable an item, set its enabled property to false:
<menuItem label="Check for Updates" enabled="false" />
The most important feature to add to menu items is an associated function to be called when that item is selected. To make that association, assign the name of the function to the XML element's onSelect property:
<menuItem label="Exit" onSelect="doExit" />
When the user selects File > Exit, the doExit() function will be called (notice that the parentheses are not used in the XML data). This doExit() function, defined in the downloadable source code, terminates the running application.
As another example, the showHideTips() function is called when Help > Show Tips is selected:
<menuItem label="Show Tips" type="check" toggled="false" onSelect="showHideTips" />
That function definition (in JavaScript) looks like this:
function showHideTips(e, d) { if (d.checked == false) { d.checked = true; } else { d.checked = false; } }
Every function called when a menu item is selected will receive two arguments: an Event object and an object of data associated with the selected menu item. In the showHideTips() function, this second object is used to toggle the checked property of the menu item. The term checked is used here because this is within the AIR framework, as opposed to using toggled (which is MenuBuilder's term for the same thing). So, in this function, if the object's checked attribute is false, then it's set to true, and vice versa. This code effectively toggles the checked setting of the menu item.
And that's how easy it is to use MenuBuilder! Two other topics I didn't cover in this article are keyboard equivalents and menu mnemonics. Both are also possible when using MenuBuilder. For instructions, see Adobe's Developing Adobe AIR 1.5 Applications with HTML and Ajax documentation