Menu Control in Flex4


 

Menu Control in Flex4

The Menu contol is a pop-up control. It containes a submenu. You can select a indivisual item from menu control. You use only Actionscript for create a pop-up Menu control.

The Menu contol is a pop-up control. It containes a submenu. You can select a indivisual item from menu control. You use only Actionscript for create a pop-up Menu control.

Menu Control  in Flex4:

The Menu contol is a pop-up control. It containes a submenu. You can select a indivisual item from menu control. You use only Actionscript for create a pop-up Menu control. There is no MXMl tag. You can set the coordinate x, y in show() method as an arguments. The syntax of create a pop-up Menu control is following.

        var menu1:Menu= Menu.createMenu(null, menuItem, false);

You can display menu contol using show() method and pass the coordinate as an arguments.

        menu1.show(0, 35);

Example:

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:mx="library://ns.adobe.com/flex/mx">

<fx:Script>

<![CDATA[

import mx.controls.Menu;

import mx.events.FlexEvent;

import mx.events.MenuEvent;

protected var menu1:Menu;

[Bindable]

[Embed(source="C:/work/bikrant/flex4component/menu/File.png")]

public var topIcon:Class;

[Bindable]

[Embed(source="C:/work/bikrant/flex4component/menu/document.gif")]

public var top1Icon:Class;

[Bindable]

[Embed(source="C:/work/bikrant/flex4component/menu/Save.gif")]

public var top2Icon:Class;

protected function showMenu():void

{

menu1 = Menu.createMenu(null, menuItem, false);

menu1.labelField="@label";

menu1.iconField="@icon";

menu1.show(0, 35);

}

]]>

</fx:Script>

0

<fx:Declarations>

<fx:XML format="e4x" id="menuItem">

<root>

1

<menuitem label="MenuItem A">

<menuitem label="File" icon="topIcon">

<menuitem label="New"/>

2

<menuitem label="Open"/>

<menuitem label="Save" icon="top2Icon"/>

<menuitem label="Save as..."/>

3

<menuitem label="Close"/>

<menuitem label="Print"/>

<menuitem type="separator"/>

4

<menuitem label="Quit"/>

</menuitem>

<menuitem label="Edit">

5

<menuitem label="Undo"/>

<menuitem label="Redo"/>

<menuitem type="separator"/>

6

<menuitem label="Cut"/>

<menuitem label="Copy"/>

<menuitem label="Paste"/>

7

</menuitem>

<menuitem label="View"/>

<menuitem label="Document" icon="top1Icon"/>

8

<menuitem label="Tools">

<menuitem label="BasicToolsSubToolBar">

<menuitem label="SelectMenuItem"/>

9

<menuitem label="HandMenuItem"/>

<menuitem label="ZoominMenuItem"/>

<menuitem label="ZoomDragMenuItem"/>

0

</menuitem>

<menuitem label="AnalysisToolsItem"/>

</menuitem>

1

<menuitem label="Window"/>

<menuitem label="Help"/>

</menuitem>

2

<menuitem label="MenuItem B"/>

<menuitem label="MenuItem C"/>

<menuitem label="MenuItem D"/>

3

</root>

</fx:XML>

</fx:Declarations>

4

<s:Panel title="Menu Control Example" width="553" height="238">

<s:Button x="10" y="174" label="Show Menu" click="showMenu()"/>

</s:Panel>

5

</s:Application>

In this example you can see how we can use a Menu control  in Flex4.

Output:

6

Running Application:

To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.

Download this code

7

Ads