Building AIR Application Menus with the MenuBuilder Framework
- Defining the Menus in XM
- Invoking the MenuBuilder Framework
- Adding Menu Features
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
I recently came across an interesting Adobe AIR framework called MenuBuilder. This is a JavaScript file that was added to the Adobe AIR Software Development Kit (SDK) as of AIR version 1.1. This framework can generate application, window, or contextual menus from an XML or JavaScript Object Notation (JSON) data file. By using the framework instead of hand-coding your menu creation, you can minimize errors and better modularize your work. This article demonstrates how you can use the MenuBuilder framework in your Ajax-based AIR applications.
Defining the Menus in XML
For a specific example, I turned to Chapter 7, "Creating Menus," in my book Adobe AIR with Ajax: Visual QuickPro Guide. In that chapter, we create two menus: File (see Figure 1) and Help (see Figure 2). The script_07_05.html file in the source code for this article shows the complete JavaScript required to create these menus.
)
Figure 1 File menu.
)
Figure 2 Help menu.
To define the menus, create either an XML or JSON file. I'll use XML, as the JSON format can be a pain to write from scratch (its syntax is quite particular). An XML file is a plain-text document that can be created in any text editor or integrated development environment. The XML file should start with the standard opening:
<?xml version="1.0" encoding="utf-8"?>
Next, the XML file should have one root element, which I'll just call root:
<root></root>
To create the menu items, add sub-elements to the root element. To create File and Help menus, for example, the XML file would look like this:
<?xml version="1.0" encoding="utf-8"?> <root> <menu label="File"></menu> <menu label="Help"></menu> </root>
As you might expect, the label attribute is where you assign the text that will appear in the menu. The names of the elements can be anything that's allowed in XML, so use something meaningful and consistent.
For contextual menus, you'd likely use top-level menu items. For application and window menus, the structure is nested; each top-level menu item (File, Help, and so on) is just a label, with the specific functionality (Exit, Show Tips, and so on) defined as a submenu item. Let's flesh out the example:
<menu label="File"> <menuItem label="Exit" /> </menu> <menu label="Help"> <menuItem label="Show Tips" /> <menuItem label="Help Pages" /> <menuItem label="Check for Updates" /> <menuItem label="Visit Web Site" /> </menu>
For each of the submenu items, we use a condensed element format—that is, the element is closed using a space and a slash, rather than a formal closing tag. The labels correspond to those shown earlier in Figures 1 and 2. As with the top-level menus, the names of the elements can be anything valid, but take care to be consistent.