2

Flex 和 mxml 的新功能。如何将 AS3 类的功能绑定到菜单栏项?我的菜单栏代码是这样的:

<mx:MenuBar id="myMenubar" labelField="@label">
    <fx:XMLList xmlns="">
        <item label="File">
            <item label="New" />
            <item label="Open"/>
            <item label="Save"/>
            <item label="Save As"/>
            <item label="Quit"/>
        </item>

        <item label="Edit">
            <item label="Undo"/>
            <item label="Redo"/>
            <item label="Preferences"/>
        </item>

        <item label="Level">
            <item label="New Room"/>
            <item label="Properties"/>
        </item>

        <item label="Objects">
            <item label="Clickable"/>
            <item label="Character"/>
            <item label="Door"/>
            <item label="Treasure"/>
        </item>
    </fx:XMLList>
</mx:MenuBar>

我浏览了 Google 中的几个示例,但找不到明确的解释或示例如何触发 AS3 类函数。我认为我应该以某种方式为我的子项制作点击事件监听器并调用我的班级。但是,mxml 语法让我感到困惑。

4

1 回答 1

1

MXML只是一种以声明方式描述数据和组件的方式,最终无论如何它都会编译为纯 ActionScript,因此您只需订阅一个适当的侦听器即可myMenubar

我认为您正在寻找该itemClick事件:

myMenubar.addEventListener(MenuEvent.ITEM_CLICK, function(e:MenuEvent):void
{
    trace(e.label + ' was clicked');
});

为了能够在更改标签的同时区分项目,我建议为它们分配 ID:

<mx:MenuBar id="myMenubar" labelField="@label">
    <fx:XMLList xmlns="">
        <item label="File">
            <item id="abc" label="New" />
            <item id="xyz" label="Open"/>
            ...

然后你可以例如使用一个简单的开关来处理不同的项目:

myMenubar.addEventListener(MenuEvent.ITEM_CLICK, function(e:MenuEvent):void
{
    switch(e.item.@id)
    {
        case 'abc':
            // do something
            break;

        case 'xyz':
            // do something else
            break;
    }
});

当然,您也可以使用以下方法定义要调用的函数MXML

<mx:MenuBar id="myMenubar" labelField="@label" itemClick="myMenuItemClickHandler(event)">

-

private function myMenuItemClickHandler(e:MenuEvent)
{
    ...
}

另请参阅Adob​​e LiveDocs 中的示例,以了解这一切是如何结合在一起的:

<?xml version="1.0" encoding="utf-8"?>
<!-- Simple example to demonstrate the Halo MenuBar control. -->
<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"
        initialize="initCollections();">

    <fx:Script>
        <![CDATA[
            import mx.collections.*;
            import mx.controls.Alert;
            import mx.events.MenuEvent;

            [Bindable]
            public var menuBarCollection:XMLListCollection;

            private var menubarXML:XMLList =
                <>
                    <menuitem label="Menu1" data="top">
                        <menuitem label="MenuItem 1-A" data="1A"/>
                        <menuitem label="MenuItem 1-B" data="1B"/>
                    </menuitem>
                    <menuitem label="Menu2" data="top">
                        <menuitem label="MenuItem 2-A" type="check" data="2A"/>
                        <menuitem type="separator"/>
                        <menuitem label="MenuItem 2-B" >
                            <menuitem label="SubMenuItem 3-A" type="radio"
                                groupName="one" data="3A"/>
                            <menuitem label="SubMenuItem 3-B" type="radio"
                                groupName="one" data="3B"/>
                        </menuitem>
                    </menuitem>
                </>;

            // Event handler to initialize the MenuBar control.
            private function initCollections():void {
                menuBarCollection = new XMLListCollection(menubarXML);
            }

            // Event handler for the MenuBar control's itemClick event.
            private function menuHandler(evt:MenuEvent):void  {
                // Don't open the Alert for a menu bar item that 
                // opens a popup submenu.
                if (evt.item.@data != "top") {
                    Alert.show("Label: " + evt.item.@label + "\n" + 
                        "Data: " + evt.item.@data, "Clicked menu item");
                }
            }
         ]]>
    </fx:Script>

    <s:Panel title="Halo MenuBar Control Example"
            width="75%" height="75%"
            horizontalCenter="0" verticalCenter="0">
        <s:VGroup left="10" right="10" top="10" bottom="10">
            <s:Label width="100%" color="blue" text="Select a menu item."/>

            <mx:MenuBar labelField="@label" itemClick="menuHandler(event);" 
                    dataProvider="{menuBarCollection}" />
        </s:VGroup>
    </s:Panel>

</s:Application>
于 2012-10-22T12:35:07.703 回答