Actionscript 3和动态掩码

Question

我有一个容器MovieClip作为我需要掩盖的内容区域.当我使用Shape在这个容器内创建一个mask时,我似乎无法与我在这里创建的其他容器的内容交互,比如按钮等.

这就是我在代码中所做的事情(我已经省略了所有的导入等):

class MyContainer extends MovieClip
{
   protected var masker : Shape = null;
   protected var panel : MyPanel = null;

   public function MyContainer()
   {
      this.masker = new Shape();
      this.masker.graphics.clear();
      this.masker.graphics.beginFill( 0x00ff00 );
      this.masker.graphics.drawRect(0, 0, 1, 1);  // 1x1 pixel.
      this.masker.graphics.endFill();
      addChild( this.masker );

      this.panel = new MyPanel();  // has buttons and stuff.
      addChild( this.panel );

      this.mask = this.masker;
   }

   // called by it's parent when the stage is resized.
   public function resize( width : Number, height : Number ) : void
   {
      // set the mask to half the size of the stage.
      this.masker.width  = width  / 2;
      this.masker.height = height / 2;

      // set the panel to half the size of the stage.
      this.panel.resize( width / 2, height / 2);
   }
}

当我将掩码(Shape)添加到显示层次结构时,我无法再与MyPanel中定义的任何按钮进行交互.但是,不将掩码添加到显示层次结构中会让我与MyPanel上的内容进行交互,但掩码的大小/位置不正确.我猜,当掩码没有添加到显示层次结构时,它就位于电影的左上角(虽然我无法证明这一点).

如何正确制作我的面具尺寸/位置并让用户与MyPanel中的按钮进行交互？

Answer 1

this.masker.mouseEnabled = false; //set on this.masker

这应该工作.现在,在他们到达容器中的任何其他东西之前,它会拦截您的事件.不是100%肯定,但我相信面具将坐在容器的顶部.另一种选择是将另一个屏蔽子项添加到displayList底部的MyContainer,并添加面板作为其兄弟.尽管如此,你仍然希望在被屏蔽的精灵/ mc上将mouseEnabled和mouseChildren设置为false.

package
{
    import flash.display.Shape;
    import flash.display.Sprite;

    public class MyContainer extends Sprite
    {
       protected var masker : Shape = null;
       protected var panel:MyPanel;

       public function MyContainer()
       {

          this.masker = new Shape();
          this.masker.graphics.clear();
          this.masker.graphics.beginFill( 0x00ff00 );
          this.masker.graphics.drawRect(0, 0, 1, 1);  // 1x1 pixel.
          this.masker.graphics.endFill();
          addChild( this.masker );

          this.panel = new MyPanel();
          this.addChild(panel);
          this.mask = this.masker;
       }

       // called by it's parent when the stage is resized.
       public function resize( width : Number, height : Number ) : void
       {
          // set the mask to half the size of the stage.
          this.masker.width  = width  / 2;
          this.masker.height = height / 2;

          // set the panel to half the size of the stage.
       }
    }
}

-

package
{
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.events.MouseEvent;

    public class MyPanel extends Sprite
    {
        public function MyPanel()
        {
            this.graphics.beginFill(0xFF0000)
            this.graphics.drawRect(0,0,10,10);
            this.addEventListener(MouseEvent.MOUSE_OVER, this.handleMouseOver)
            this.addEventListener(MouseEvent.MOUSE_OUT, this.handleMouseOut)
        }

        public function handleMouseOver(event:Event):void
        {
            this.graphics.clear();
            this.graphics.beginFill(0x00FF00)
            this.graphics.drawRect(0,0,10,10);
        }

        public function handleMouseOut(event:Event):void
        {
            this.graphics.clear();
            this.graphics.beginFill(0xFF0000)
            this.graphics.drawRect(0,0,10,10);
        }
    }
}