由于动画片段重叠导致的AS3 MOUSE_OVER问题

Question

我正在研究屏幕上有很多不同按钮的东西。按钮需要使用动画片段制作，而不是实际的“按钮”。

我正在使用Flash CS4和ActionScript 3。

我在鼠标悬停时在按钮周围创建了一个发光效果。这很有效，除了发光效果为按钮创建一个大约是实际按钮宽度和高度两倍的按钮。我做了一些研究，最后在里面做了一个符号按钮符号，它只包含我想触发按钮的命中区域。这非常适合触发按钮。现在，当我将鼠标悬停在按钮上时，它们只会在我点击实际按钮图形本身时点亮，而不是点亮它周围的发光动画。然而，问题是由于某种原因，动画中的框仍然阻止鼠标悬停在附近的按钮上被检测到（如果框与它们重叠。）

这可能听起来令人困惑，所以这是一张图片：

• 绿色区域定义鼠标激活发光的位置 动画。

• 红色区域定义了发光动画符号的实际框。

• 黄色区域定义按钮的没有的部分 激活发光动画，因为红色框正在阻止 mouseover事件被解雇。

• 我遗漏了左侧按钮的红色框，以便更容易看到问题，请注意，事实上，这两个按钮周围有一个这样的框，按钮上右侧刚放在左侧按钮后的舞台上，导致其盒子位于左侧按钮的顶部。

注意：命中区域和动画都已包含在按钮元件内的单独符号中。将动画符号的mouseEnabled和mouseChildren设置为false似乎没有像我希望的那样做到这一点（基于研究这个问题。）

注意：当鼠标移动到红色区域时动画不会激活（并且不应该激活），只有当鼠标移动到绿色区域时它才会激活，这是所需的行为，唯一问题是我不希望鼠标事件检测到红色框。

以下是按钮类的代码：

package classes{

    import flash.display.MovieClip;
    import flash.events.MouseEvent;
    import flash.events.Event;
    public class glowing_place_marker extends MovieClip {

        public static var instances:Array = new Array();
        public var is_playing:Boolean=false;
        private var is_mouse_over:Boolean = false;
        private var animation:MovieClip;

        public function glowing_place_marker() {

            this.animation = this.place_marker_animation;
            this.animation.stop();
            this.animation.mouseEnabled = false;
            this.animation.mouseChildren = false;   

            self:instances.push(this);
            this.place_marker_hit.addEventListener(MouseEvent.MOUSE_OVER, roll_over_handler);
            this.place_marker_hit.addEventListener(MouseEvent.MOUSE_OUT, roll_out_handler);

        }

        public function roll_over_handler(e:MouseEvent) {
            this.animation.play();      
            this.is_playing=true;
            this.is_mouse_over = true;

        }

        public function roll_out_handler(e:MouseEvent) {

            stage.addEventListener(Event.ENTER_FRAME, checkFrame);
            this.is_mouse_over = false;
        }

        function checkFrame(event:Event):void {
            if (!this.is_mouse_over) {
                if (this.animation.currentFrame==1) {
                    stage.removeEventListener(Event.ENTER_FRAME, checkFrame);   
                    this.animation.stop();              
                    this.is_playing = false;

                }
            }
        }

    }

}

任何人都可以向我解释如何获取动画的框（红色框），而不是阻止它下面的按钮？ （有效地使鼠标事件无法检测到红色框，因此点击，鼠标悬停等直接通过它到达下面的项目。）

提前谢谢。

Answer 1

尝试在容器mouseEnabled = false（带发光的容器）上设置DisplayObject，其中包含按钮的命中区域。您仍然希望离开mouseChildren = true。这样，发光不应再阻止鼠标事件。

关于mouseEnabled和mouseChildren的有用之处在于您可以选择禁用只是容器，或只是容器的子容器。

这是一个很好的阅读：

The power and genius of mouseChildren and mouseEnabled