Управление меню Flex - Нажмите кнопку, и отобразится меню. Как я могу нажать эту кнопку во второй раз и скрыть это меню? - PullRequest
Новая
       22

Управление меню Flex - Нажмите кнопку, и отобразится меню. Как я могу нажать эту кнопку во второй раз и скрыть это меню?

1 голос
/ 20 июня 2010

В принципе, у меня есть кнопка, и при нажатии она отображает меню. Я хочу нажать на это меню во второй раз, и меню закрывается. В настоящее время каждый раз, когда вы нажимаете кнопку, меню открывается. Я приклеил пример Flex liveoc ниже. Если вы нажмете кнопку, меню снова откроется.

Теперь я настроил его, установив переменную для открытия и закрытия, поэтому при нажатии на кнопку выполняется проверка. Однако, если вы щелкнете по экрану, событие HIDE будет отправлено, и меню закроется. Это испортило настройку открытия и закрытия.

Как сделать так, чтобы в приведенном ниже примере Flex отображалось меню при нажатии кнопки, а затем при втором нажатии кнопки меню закрывалось? Примите во внимание, что если вы щелкнете по меню, оно закроется.

Кроме того, я поигрался с событием MOUSE_DOWN_OUTSIDE для кнопки и установил warnDefault, а событию FlexMouseEvent.cancelable присвоено значение false.

Переключение на PopUpMenuButton не вариант. У меня много шкуры.

Вот пример Flex: 

<mx:Script>
    <![CDATA[
        // Import the Menu control.
        import mx.controls.Menu;

        // Create and display the Menu control.
        private function createAndShow():void {
            var myMenu:Menu = Menu.createMenu(null, myMenuData, false);
            myMenu.labelField="@label";
            myMenu.show(10, 10);
        }
    ]]>
</mx:Script>

<!-- Define the menu data. -->
<mx:XML format="e4x" id="myMenuData">
    <root>
        <menuitem label="MenuItem A" >
            <menuitem label="SubMenuItem A-1" enabled="false"/>
            <menuitem label="SubMenuItem A-2"/>
        </menuitem>
        <menuitem label="MenuItem B" type="check" toggled="true"/>
        <menuitem label="MenuItem C" type="check" toggled="false"/>
        <menuitem type="separator"/>     
        <menuitem label="MenuItem D" >
            <menuitem label="SubMenuItem D-1" type="radio" 
                groupName="one"/>
            <menuitem label="SubMenuItem D-2" type="radio" 
                groupName="one" toggled="true"/>
            <menuitem label="SubMenuItem D-3" type="radio" 
                groupName="one"/>
        </menuitem>
    </root>
</mx:XML>

<mx:VBox>
    <!-- Define a Button control to open the menu -->
    <mx:Button id="myButton" 
        label="Open Menu" 
        click="createAndShow();"/>
</mx:VBox>

1 Ответ

2 голосов
/ 20 июня 2010 
//Declare menu as an instance variable instead of a local var
private var myMenu:Menu;

//var to store menu status
private var isMenuVisible:Boolean

//Create the Menu control. call this from the creationComplete of the 
//application or the Component that it is part of.
private function createMenu():void 
{
    var myMenu:Menu = Menu.createMenu(null, myMenuData, false);
    myMenu.labelField="@label";
    //menu fires an event when it is hidden; listen to it.
    myMenu.addEventListener(MenuEvent.MENU_HIDE, onMenuHidden);
}
private function onMenuHidden(e:MenuEvent):void
{
    /*
    menuHide event fired whenever the menu or one of its submenus
    are hidden - makes sure it was indeed the main menu that was hidden
    I don't have compiler handy to test this, so if for 
    some reason comparing myMenu with e.menu doesn't work,
    try if(e.target == myMenu) instead; 
    And please let me know which one works via comment :)
    */

    if(e.menu == myMenu)
       isMenuVisible = false;
}
//call this from button's click 
private function toggleMenu():void
{
    if(isMenuVisible)
        myMenu.hide();
    else
        myMenu.show();
}
...