[AS]mouseEnabled=falseで下の階層にあるボタンを有効にするときの注意。
感覚的に勘違いをしていたのでメモしておく。
言葉で書いてもうまく伝えられないので、まずは以下フレームアクションのスクリプト参照。
import flash.display.Sprite; //1階層目 //コンテナ的sp(塗り無し) var container01:Sprite = new Sprite(); //コンテナの背景的なもの(赤塗り) var bg01:Sprite = new Sprite(); bg01.graphics.beginFill(0xFF0000); bg01.graphics.drawRect(0,0,300,300); bg01.graphics.endFill(); //ボタン的なもの var btn01:Sprite = new Sprite(); btn01.graphics.beginFill(0x660000); btn01.graphics.drawRect(40,40,40,40); btn01.graphics.endFill(); btn01.buttonMode = true; //コンテナ的なものをメインのタイムラインに配置 this.addChild(container01); //背景的なものをコンテナに配置 container01.addChild(bg01); //ボタン的なものをコンテナに配置 container01.addChild(btn01); ////////////////////////////////////// //2階層目 //コンテナ的sp(塗り無し) var container02:Sprite = new Sprite(); //1階層目が見えるように半透明にして配置をずらす container02.alpha = .5; container02.x = container02.y = 20; //コンテナの背景的なもの(青塗り) var bg02:Sprite = new Sprite(); bg02.graphics.beginFill(0x0000FF); bg02.graphics.drawRect(0,0,300,300); bg02.graphics.endFill(); //ボタン的なもの var btn02:Sprite = new Sprite(); btn02.graphics.beginFill(0x000066); btn02.graphics.drawRect(40,40,40,40); btn02.graphics.endFill(); btn02.buttonMode = true; //コンテナ的なものをメインのタイムラインに配置 this.addChild(container02); //背景的なものをコンテナに配置 container02.addChild(bg02); //ボタン的なものをコンテナに配置 container02.addChild(btn02); //1階層目のボタンを押せるようにするには、 //2階層目の背景的なものをmouseEnabled = false bg02.mouseEnabled = false; //さらに、コンテナ的なspもmouseEnabled = false; //にしないとだめ container02.mouseEnabled = false;
はまったポイントは2階層目のコンテナ自身に対してもmouseEnable=falseを設定してあげないといけないということ。
2階層目のコンテナ自身は塗りを持ってないから、(塗りの実体である)背景だけをmouseEnable=falseにすればいいんじゃね、と思い込んでおりましたが、それだと1階層目のボタンに触れません。
コンテナ自身もmouseEnabled=falseにしてやらないとだめだったのです。
感覚的に、コンテナをmouseEnabled=falseにしちゃったら、コンテナが内包しているボタンもmouseEnabled=false扱いとなってしまうかと思ったら、そんなことは無いというオチ。
mouseChildrenってプロパティもあるし、それぞれの機能をちゃんと理解しとかないとマズイです。。
Tweet