Creating an application with the Menu component

In the following example, a developer is building an application and uses the Menu component to expose some of the commands that users can issue, such as Open, Close, and Save.

To create an application with the Menu component:

Select File > New and choose Flash File (ActionScript 2.0).

Drag the Menu component from the Components panel to the library.

Menus are created dynamically through ActionScript.

Drag a Button component from the Components panel to the library.

The button will be used to activate the menu.

In the Actions panel, on the first frame, enter the following code to add an event listener to listen for click events on the button. The code also listens for a change event on the menu and displays the name of the selected menu item in the Output panel:

/**
 Requires:
  - Menu component in library
  - Button component in library
*/

import mx.controls.Button;
import mx.controls.Menu;

this.createClassObject(Button, "menu_button", 10, {label:"Launch Menu"});

// Create a menu.
var my_menu:Menu = Menu.createMenu();

// Add some menu items.
my_menu.addMenuItem("Open");
my_menu.addMenuItem("Close");
my_menu.addMenuItem("Save");
my_menu.addMenuItem("Revert");

// Add a change-listener to Menu to detect which menu item is selected.
var menuListener:Object = new Object();
menuListener.change = function(evt_obj:Object) {
 var item_obj:Object = evt_obj.menuItem;
 trace("Item selected: "+item_obj.attributes.label);
};
my_menu.addEventListener("change", menuListener);

// Add a button listener that displays the menu when the button is clicked.
var buttonListener:Object = new Object();
buttonListener.click = function(evt_obj:Object) {
 var my_button:Button = evt_obj.target;
 // Display the menu at the bottom of the button.
 my_menu.show(my_button.x, my_button.y + my_button.height);
};
menu_button.addEventListener("click", buttonListener);

Select Control > Test Movie.

Click the Launch Menu button to display the menu. When you select a menu item, a trace() statement reports the selection in the Output panel.

To use XML data from a server to create and populate a menu:

Select File > New and choose Flash File (ActionScript 2.0).

Drag the Menu component from the Components panel to the library.

Menus are created dynamically through ActionScript.

In the Actions panel, add the following code to the first frame to create a menu, and use the dataProvider property to load menu items from a web page:

/**
 Requires:
  - Menu component in library
*/

import mx.controls.Menu;

var my_menu:Menu = Menu.createMenu();

// Import an XML file.
var myDP_xml:XML = new XML();
myDP_xml.ignoreWhite = true;
myDP_xml.onLoad = function(success:Boolean) {
 // When the data arrives, pass it to the menu.
 if (success) {
  my_menu.dataProvider = myDP_xml.firstChild;
 }
};
myDP_xml.load("http://www.flash-mx.com/mm/xml/menu.xml");

// Show and position the menus.
my_menu.show(100, 20);

NOTE

The menu items are described by the children of the XML document's first child.

Select Control > Test Movie.

The xml menu definition from the web page is provided here for your reference:

<?xml version="1.0" ?> 
<menu> 
<menuitem label="Undo" /> 
<menuitem type="separator" /> 
<menuitem label="Cut" /> 
<menuitem label="Copy" /> 
<menuitem label="Paste" /> 
<menuitem label="Clear" /> 
<menuitem type="separator" /> 
<menuitem label="Select All" /> 
</menu>

To use a well-formed XML string to create and populate a menu:

Select File > New and choose Flash File (ActionScript 2.0).

Drag the Menu component from the Components panel to the library.

Menus are created dynamically through ActionScript.

In the Actions panel, add the following code to the first frame to create a menu and add some items:

/**
 Requires:
  - Menu component in library
*/

import mx.controls.Menu;

// Create an XML object to act as a factory.
var my_xml:XML = new XML();

// The item created next does not appear in the menu.
// The createMenu() method call (below) expects to
// receive a root element whose children will become
// the items. This is just a simple way to create that
// root element and give it a convenient name.
var theMenuElement_obj:Object = my_xml.addMenuItem("XXXXX");

// Add the menu items.
theMenuElement_obj.addMenuItem({label:"Undo"});
theMenuElement_obj.addMenuItem({type:"separator"});
theMenuElement_obj.addMenuItem({label:"Cut"});
theMenuElement_obj.addMenuItem({label:"Copy"});
theMenuElement_obj.addMenuItem({label:"Paste"});
theMenuElement_obj.addMenuItem({label:"Clear", enabled:"false"});
theMenuElement_obj.addMenuItem({type:"separator"});
theMenuElement_obj.addMenuItem({label:"Select All"});

// Create the Menu object.
var my_menu:Menu = Menu.createMenu(this, theMenuElement_obj);

// Show and position the menus.
my_menu.show(100, 20);

Select Control > Test Movie.

To use the MenuDataProvider class to create and populate a menu:

Select File > New and choose Flash File (ActionScript 2.0).

Drag the Menu component from the Components panel to the library.

Menus are created dynamically through ActionScript.

In the Actions panel, add the following code to the first frame to create a menu and add some items:

/**
 Requires:
  - Menu component in library
*/

import mx.controls.Menu;

// Create an XML object to act as a factory.
var xml = new XML();

// The item created next does not appear in the menu.
// The createMenu() method call (below) expects to
// receive a root element whose children will become
// the items. This is just a simple way to create that
// root element and give it a convenient name.
var theMenuElement = xml.addMenuItem("XXXXX");

// Add the menu items.
theMenuElement.addMenuItem({label:"Undo"});
theMenuElement.addMenuItem({type:"separator"});
theMenuElement.addMenuItem({label:"Cut"});
theMenuElement.addMenuItem({label:"Copy"});
theMenuElement.addMenuItem({label:"Paste"});
theMenuElement.addMenuItem({label:"Clear", enabled:"false"});
theMenuElement.addMenuItem({type:"separator"});
theMenuElement.addMenuItem({label:"Select All"});
// Create the Menu object.
var my_menu = mx.controls.Menu.createMenu(_root, theMenuElement);

my_menu.show(100, 20);

Select Control > Test Movie.

Flash CS3