tmdf.net | Flashの透過処理

久しぶりにFlashネタ。複数の子mcを配置した親mcを透過させると、各子mcの透明度が変化し、自分の意図した状態と違った表示になる場合があります。これの解決方法。

キーダウン 「1」
単純に親mcをフェードアウトした場合。本来なら円が重なったところはそのままの状態でフェードアウトして欲しいのですが、子mcに透明度が別々に割り当てられるせいで、見せたくない部分（青と重なっている緑など）まで透けて見えます。

キーダウン 「2」
「1」をビットマップキャッシュ化した場合。これでうまくいくと思っていたのですが、結果は「1」と変わりません。

キーダウン 「3」
自分の希望はこのタイプ。親mcをそのままビットマップデータに描画、親mcと同階層にそのビットマップを配置。もともとの親mcは非表示にし、ビットマップをフェードアウトさせ、完了と同時にビットマップ（データ）を削除（メモリ開放）しています。

細かい部分は下記コード、または「FadeOut.zip」を参照して下さい。連打した場合の処理はしていません。

もっとスマートな処理がありそうなので、思いついたら追記したいと思います。また、今回のように単純に黒ベタ背景でフェードアウトする場合は、逆に黒ベタを親mcの前面にフェードインさせるのが一番楽です。

//Sample.as

package {
	import caurina.transitions.Tweener;
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.display.DisplayObject;
	import flash.display.Graphics;
	import flash.display.MovieClip;
	import flash.events.Event;
	import flash.events.KeyboardEvent;

	public class Sample extends MovieClip {

		//起動時
		public function Sample():void {

			//リスナー登録
			this.addEventListener(Event.ADDED_TO_STAGE, Init);
		}

		//初期化
		private function Init(e:Event):void {

			//リスナー登録
			this.removeEventListener(Event.ADDED_TO_STAGE, Init);

			//オブジェクト生成
			var g:Graphics;

			//赤
			var Red_mc:MovieClip = new MovieClip();
			g = Red_mc.graphics;
			g.beginFill(0xCC0000);
			g.drawCircle(0, 0, 100);
			this.addChild(Red_mc);
			Red_mc.x = 185;
			Red_mc.y = 150;

			//緑
			var Green_mc:MovieClip = new MovieClip();
			g = Green_mc.graphics;
			g.beginFill(0x33CC00);
			g.drawCircle(0, 0, 100);
			this.addChild(Green_mc);
			Green_mc.x = 285;
			Green_mc.y = 150;

			//青
			var Blue_mc:MovieClip = new MovieClip();
			g = Blue_mc.graphics;
			g.beginFill(0x0033CC);
			g.drawCircle(0, 0, 100);
			this.addChild(Blue_mc);
			Blue_mc.x = 385;
			Blue_mc.y = 150;

			//リスナー解除
			stage.addEventListener(KeyboardEvent.KEY_DOWN, KeyDown);
		}

		//キーボードが押された場合
		private function KeyDown(e:KeyboardEvent):void {

			//1～3
			if (e.keyCode == 49 || e.keyCode == 97) NormalFadeOut(false);
			else if (e.keyCode == 50 || e.keyCode == 98) NormalFadeOut(true);
			else if (e.keyCode == 51 || e.keyCode == 99) CustomFadeOut();
		}

		//ノーマル フェードアウト
		private function NormalFadeOut(_cache:Boolean):void {

			//キャッシュ
			this.cacheAsBitmap = _cache;

			//トゥイーン
			Tweener.addTween(this, {
				alpha		:0,
				time		:1.0,
				onComplete	:Reset
			});

			//フェードアウト
			function Reset():void {
				this.alpha = 1.0;
			}
		}

		//カスタム フェードアウト
		private function CustomFadeOut():void {

			//表示オブジェクトをビットマップ化
			var Copy_bmd:BitmapData = new BitmapData(stage.stageWidth, stage.stageHeight, true, 0x00000000);
			Copy_bmd.draw(this);
			var Copy_bmp:Bitmap = new Bitmap(Copy_bmd, "auto", false);

			//親オブジェクトに配置、レイヤー調整
			this.parent.addChild(Copy_bmp);
			this.parent.setChildIndex(DisplayObject(Copy_bmp), this.parent.getChildIndex(DisplayObject(this)));

			//自身を非表示
			this.alpha = 0.0;

			//親オブジェクトに配置したコピーをフェードアウト
			Tweener.addTween(Copy_bmp, {
				alpha				:0,
				time				:1.0,
				onComplete			:Reset,
				onCompleteParams	:[this]
			});

			//リセット
			function Reset(_this:Sample):void {
				_this.alpha = 1.0;
				_this.parent.removeChild(Copy_bmp);
				Copy_bmp = null;
				Copy_bmd.dispose();
				Copy_bmd = null;
			}
		}
	}
}