イメージエフェクト その1

dissolve_img



画像の見せ方もいろいろあるわけで(略
今回は画像が分割されて現れていくというエフェクトです
解説はつづきから




新規ファイル作成
ステージ設定はサイズを400×300、フレームレートは30に



好きな画像を配置して、ムービークリップシンボルに変換
インスタンス名をimg_mcに


新規レイヤーを作成し、ActionScriptを記述

//使用するパッケージを読み込む
import fl.transitions.*;
import fl.transitions.easing.*;

img_mc.buttonMode = true;    //画像にマウスを乗せると指の形に

//アニメーションの各種値設定
var myObj:Object = {
    type:PixelDissolve,    //アニメーションの種類
    direction:Transition.IN,    //効果が始まる方向
    duration:3,    //効果時間
    easing:Regular.easeIn,    //イージング設定
    xSections:20,    //X方向分割数
    ySections:15    //Y方向分割数
};

img_mc.addEventListener(MouseEvent.CLICK,dissolveImg);

//アニメーション設定
function dissolveImg(event:MouseEvent) {
    //アニメーション中はクリックできないように設定をはずす
    img_mc.removeEventListener(MouseEvent.CLICK,dissolveImg);
    img_mc.buttonMode = false;

    //アニメーションを適用
    var transition:Transition = TransitionManager.start(img_mc,myObj);

    //アニメーションが終了したら再びクリックできるように
    transition.addEventListener("transitionInDone",animationComplete);

}

//クリック再設定
function animationComplete(e:Event):void {
    img_mc.buttonMode = true;
    img_mc.addEventListener(MouseEvent.CLICK,dissolveImg);
}


これでムービープレビューすると以下のようになってるかと思います



以上、イメージエフェクト その1の作り方でした