在外部单击时隐藏菜单

Hiding a menu on click outside

我有一个弹出菜单,同时隐藏在按钮上的鼠标单击事件中,但我希望能够通过在菜单动画片段及其按钮外部单击来隐藏所述菜单。是否可以在 as3 中实现?

到目前为止,这是我找到的解决方案,经过调整并尝试使用但仍然没有任何进展。

switchbd_btn.addEventListener(MouseEvent.CLICK, onClickHandler);
stage.addEventListener(MouseEvent.CLICK, onClickHandler);

function onClickHandler(event : MouseEvent) : void  {
            switch(event.target)
            {
                case switchbd_btn:
                    switchbd.gotoAndStop(2);
                    switchbdIN.start();
                    switchbd_btn.filters = [ONf];
                    break;

                case stage:
                    switchbdOUT.start();
                    switchbd.gotoAndStop(3);
                    switchbd_btn.filters = [OFf];
                    break;
            }
}

我原来的工作代码:-

//////////////////////SWITCH BOARD\\\\\\\\\\\\\\
switchbd_btn.addEventListener(MouseEvent.MOUSE_DOWN, ShowswitchBD);
var switchbdIN:Tween = new Tween (switchbd, "x", Strong.easeOut, 1089.05, 277.85, 1, true);
var switchbdOUT:Tween = new Tween (switchbd, "x", Strong.easeOut, 277.85, 1089.05, 1, true);
var ONf:DropShadowFilter = new DropShadowFilter (-1,26,0xCCCCCC,1,2,2,1,3,false,false,false);
var OFf:DropShadowFilter = new DropShadowFilter (6,26,0x000000,1,2,2,1,3,false,false,false);

function ShowswitchBD(e:MouseEvent):void {

    if (switchbd.currentFrame != 2)
    {
        switchbd.gotoAndStop(2);
        switchbdIN.start();
        switchbd_btn.filters = [ONf];
}
    else {
        switchbdOUT.start();
        switchbd.gotoAndStop(3);
        switchbd_btn.filters = [OFf];
    }
}

switchbd 是菜单动画片段,switchbd_btn 是按钮。

这里有一个模式可以完成您的要求。这假设您的菜单 movieClip 被调用:switchbd 并且您使用按钮 show/hide 它:switchbd_btn.

首先,为您的按钮添加一个点击侦听器并创建处理函数:

switchbd_btn.addEventListener(MouseEvent.CLICK, toggleMenu);

function toggleMenu(e:Event):void {
    //the x position should be 277.85 when visible
    if(switchbd.x <= 278){
        hideMenu();
    }else{
        showMenu();
    }
}

现在创建显示和隐藏菜单函数:

function showMenu():void {
    switchbd.gotoAndStop(2); //or however you 'show' it

    switchbdIN.start();
    switchbd_btn.filters = [ONf];

    //since the menu is visible, listen for global mouse clicks to hide it
    stage.addEventListener(MouseEvent.CLICK, hideMenuGlobalClick);
}

function hideMenu():void {
    switchbd.gotoAndStop(3);
    switchbdOUT.start();
    switchbd_btn.filters = [OFf];

    //stop listening for global mouse clicks since the menu is hidden now
    stage.removeEventListener(MouseEvent.CLICK, hideMenuGlobalClick);
}

function hideMenuGlobalClick(e:Event):void {
    var target:DisplayObject = e.target as DisplayObject;

    //crawl up the display tree from the item click until there is no parent (stage)
    while(target && target.parent){
        //if the target is the menu or button, exit this function
        if(target == switchbd || target == switcbd_btn){
            return;
        }

        //move on to the next item up the chain
        target = target.parent;
    }

    //if you made it this far, it wasn't the menu that was clicked
    hideMenu();
}