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)
{
    ...
}

Adobe 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 に答える