Flashのマスクでグラデーションを利用する方法

Flash Player8以降で可能です

このように、マスク自体にグラデーションがかかっていて滑らかなアルファ（透明度）を再現したサンプルですが、意外とActionScriptなしでは出来なかったりします。

そういうのに限って需要が高かったりするので、これまた厄介（笑）。

しかしActionScriptとは言っても、それほど難解なものではないので、適用することはできますよ。

ActionScript1.0から利用可能で、Flash Player8以降であれば再生可能なので、世の中の99%以上のネットユーザーに見てもらうことが出来ます（参考：Adobe社公式のレポートページ）。

グラデーション・アルファマスクのサンプルファイル構造

今回作成したサンプルのタイムラインのスクリーンショットです。

スクリプト・サンプル

ポイントはやはりActionScriptのサンプルです。　グラデーション・マスクにしたインスタンスが「myMask」、マスクする対象が「myText」ですね。

今回のサンプルファイルです。　gradation_alpha.zip

myText.cacheAsBitmap = true;
myMask.cacheAsBitmap = true;
myText.setMask(myMask);
//徐々に右に動かす
this.onEnterFrame = function() {
    myMask._x += 5;
    //右端までいったら移動をやめる
    if (myMask._x - myMask._width > Stage.width) {
        delete this.onEnterFrame;
    }
}

ポイントは各ムービークリップに設定した「cacheAsBitmap」です。　Flashヘルプによると、cacheAsBitmapプロパティは、複雑なベクターデータの描画を高速化するためのプロパティで、ビットマップとしてステージに描画されるようになります。

2 件のコメント

• あばばばば より:

  2011-08-11 18:40

  アルファアニメーションのかかった画像を作りたかったので、非常に参考になりました。

  返信
• 山下こうじ より:

  2011-08-11 20:57

  お役に立てて良かったです！

  返信