[Flex] PopUpButton系列 —— 打开和关闭弹出菜单

<?xml version="1.0" encoding="utf-8"?>
<!--响应打开和关闭弹出菜单的例子 PopUpButtonOpenAndClose.mxml-->
<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" minWidth="955" minHeight="600">
    <s:layout>
        <s:VerticalLayout/>
    </s:layout>

    <fx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.controls.Menu;
            import mx.events.DropdownEvent;
            import mx.events.ListEvent;
            
            import spark.events.GridEvent;
            [Bindable]
            private var menu:Menu;
            
            private function init():void {
                menu = new Menu();
                menu.dataProvider = arr;
            }
            
            private function popUpButton_open(evt:DropdownEvent):void {
                arrColl.addItem(evt);
            }
            
            private function popUpButton_close(evt:DropdownEvent):void {
                arrColl.addItem(evt); 
                trace(evt.toString());
            }

            protected function dataGrid_gridClickHandler(event:GridEvent):void
            {
                var obj:DropdownEvent = event.currentTarget.selectedItem;
                if(!obj) return;
                var str:String = "(empty string)";
                if (obj.triggerEvent) {
                    str = obj.triggerEvent.toString();
                }
                Alert.show(str, "triggerEvent:");
            }
            
        ]]>
    </fx:Script>
    <fx:Declarations>
        <!-- 将非可视元素（例如服务、值对象）放在此处 -->
        <fx:Array id="arr">
            <fx:Object label="Button" />
            <fx:Object label="ButtonBar" />
            <fx:Object label="ColorPicker" />
            <fx:Object label="ComboBox" />
        </fx:Array>
        <s:ArrayCollection id="arrColl"/>
    </fx:Declarations>
    <fx:Style>
        @namespace s "library://ns.adobe.com/flex/spark";
        @namespace mx "library://ns.adobe.com/flex/mx";
         mx|PopUpButton{
            popUpStyleName: myCustomPopUpStyleName;
        }
        .myCustomPopUpStyleName {
            fontWeight: normal;
            textAlign: left;
        } 

    </fx:Style>
    <s:controlBarContent>
        <mx:PopUpButton id="popUpButton"
                        label="Select a control..."
                        popUp="{menu}"
                        initialize="init();"
                        open="popUpButton_open(event);"
                        close="popUpButton_close(event);" />
    </s:controlBarContent>
    <s:DataGrid id="dataGrid" dataProvider="{arrColl}"  variableRowHeight="true" width="500" height="400" gridClick="dataGrid_gridClickHandler(event)" >
        <s:columns>
            <s:ArrayList>
                <s:GridColumn dataField="type" width="100" />
                <s:GridColumn dataField="triggerEvent" />
            </s:ArrayList>
        </s:columns>
    </s:DataGrid>
    <!--<mx:DataGrid id="dataGrid" dataProvider="{arrColl}"  variableRowHeight="true" width="100%" height="100%" itemClick="dataGrid_itemClickHandler(event)">
        <mx:columns>
            <mx:DataGridColumn dataField="type" width="100"/>
            <mx:DataGridColumn dataField="triggerEvent" itemRenderer="mx.controls.Label"/>
        </mx:columns>
    </mx:DataGrid>-->
</s:Application>