ActionScript2.0: 2008年6月アーカイブ

複数人でFlashコンテンツを制作する場合、外部SWFを読み込んでコンテンツを展開し
作業を切り分けすると思いますが、ぶっちゃけローダーを利用するScriptって全部一緒だよなと思って
「じゃぁパーツ化しちゃおうか」ってことで、適当に作ってみました。

サンプルを表示

contentschange.zip

クラスファイルとかにしてないんで、基本ソースコピペですが、タイムライン派・オーサリング派にとってはこっちの方が分かりやすいのではないだろうか?

//ローダー
import flash.filters.BlurFilter;
import mx.transitions.Tween;
import mx.transitions.easing.*;

Stage.showMenu = false;

var mcLoader:Object = new Object();
loader_mcl = new MovieClipLoader();
loader_mcl.addListener(mcLoader);

//アクティブ格納変数
var vew_mc:MovieClip;
//生成したMCのユニークカウント用
var Count:Number = 0;

function loadContents(contents:String){
    //ステージに配置したムービークリップにローダー用のMCを生成し引数contentsを読み込む
    panel_mc = loader_mc.createEmptyMovieClip("pane" + Count++ , loader_mc.getNextHighestDepth());
    loader_mcl.loadClip(contents , panel_mc);
   
    panel_mc._x = 0;
    panel_mc._y = 0;
   
    //アクティブを格納
    vew_mc = panel_mc;
   
    mcLoader.onLoadInit = function(){
        //読み込み終了処理、今回は特になし。
    }
    mcLoader.onLoadError = function(target_mc:MovieClip, errorCode:String, httpStatus:Number){
        trace(errorCode);
    }
}

function cngContents(target_str:String){
    //ロード前処理
    //アクティブが存在すれば、トランジションを実行、アクティブが存在しない場合は直ちに読み込み処理を走らせる。
    if(vew_mc){
        var blurTween:Tween = new Tween(vew_mc, "blur", Strong.easeOut, 0, 8, 5, false);
       
        /*
        Tweenクラスは、トゥイーンモーションの対象プロパティだけでなく、オブジェクトに設定した変数の値も
        トゥイーンさせる(動かす)ことができるので
        var blurTween:Tween = new Tween(vew_mc, "blur", Strong.easeOut, 0, 8, 5, false);
        で、vew_mcに変数[blur]を宣言し、それをTweenクラスにより、0~8まで、5フレームで変化させる
        という意味になる。
        */
       
        blurTween.onMotionChanged = function(){
            var filter:BlurFilter = new BlurFilter(vew_mc.blur, vew_mc.blur, 3);
            vew_mc.filters = [filter];
           
            /*
            onMotionChangedは、モーションが変化している間処理を実行する。
            モーションは1フレーム毎に変化するため、onEnterFrameイベントに近い効果が得られる。
            var filter:BlurFilter = new BlurFilter(vew_mc.blur, vew_mc.blur, 3);
            ブラーフィルターのぼかしのパラメータに[vew_mc.blur]を指定することで、
            blurTweenが行われている間、0~8まで、5フレームで変化する値が入り、
            ブラーアニメーションが行われる。
            */
        }
        var alphaTween:Tween = new Tween(vew_mc, "_alpha", Regular.easeIn, 100, 0, 10, false);
        alphaTween.onMotionFinished = function(){
            vew_mc.removeMovieClip();
            loadContents(target_str);
        }
    }else{
        loadContents(target_str);
    }
}

んで、ボタンのイベントやその他のトリガのとこに「cngContents(target_str:String)」でtarget_strに読み込むSWFファイルのパスを入れてやればOK。

サンプルの例だとボタンの処でfunctionを実行してるわけだけれど、そこにちょっとひと工夫してあって
プルダウンをクリックすると、読み込んだSWFファイルの中の任意のタブを開くfunctionを実行するようにしている。

import mx.transitions.Tween;
import mx.transitions.easing.*;

//各ボタンのリンク先URL生成用の文字列
var fileName:String = "subPanel_";
var extend:String = ".swf";

//サブパネルのタブ枚数
subMenu0_mc.count = 3;
subMenu1_mc.count = 2;
subMenu2_mc.count = 3;
subMenu3_mc.count = 2;
subMenu4_mc.count = 3;

//メニュー内のボタンの数
var btnCount:Number = 5;
//ボタンのオーバーアウトアクションの持続時間
var TIME:Number = 15;
//アクティブになってるコンテンツの格納変数
var active_mc:MovieClip;

//サブメニューが開いてる時のY座標
var subMenuVewY = 30;
//サブメニューのトゥイーン持続時間
var subMenuBtnOverTime = 5;
//アクティブのサブメニューの格納変数
var activeSubMenu:MovieClip;

for(i = 0 ; i < btnCount ; i++){
    //ボタンの初期設定
    this["btn" + i + "_mc"].over_mc._alpha = 0;
    this["btn" + i + "_mc"].prm = i;
    //各ボタンが参照するSWFファイル名を設定
    this["btn" + i + "_mc"].link = fileName + this["btn" + i + "_mc"].prm + extend;
    
    //プルダウンメニューの初期設定
    var subMenu_mc = this["subMenu"+ i + "_mc"];
    subMenu_mc.prm = i;
    subMenu_mc.hideY = subMenu_mc._y = subMenuVewY - subMenu_mc._height; //サブメニューが閉じるときのY座標
    
    //hitTestエリアの初期設定
    var hitArea_mc = this["hit" + i + "_mc"];
    hitArea_mc.prm = i;
    hitArea_mc._alpha = 0;
    hitArea_mc._height += subMenu_mc._height;
    
    //メニューボタンのイベントハンドラ
    this["btn" + i + "_mc"].onRollOver = function(){
        //------------------プルダウン設定
        targetSubMenu_mc = this._parent["subMenu"+ this.prm + "_mc"];
        var overTween:Tween = new Tween(targetSubMenu_mc, "_y", Regular.easeOut,targetSubMenu_mc._y, subMenuVewY, subMenuBtnOverTime, false);
        
        //hitTestによるプルダウンのRollOut判定
        var targetArea_mc = this._parent["hit" + this.prm + "_mc"];
        targetArea_mc.onEnterFrame = function(){
            if( !this.hitTest(_root._xmouse , _root._ymouse , false) ){
                targetSubMenu_mc = this._parent["subMenu"+ this.prm + "_mc"];
                var overTween:Tween = new Tween(targetSubMenu_mc, "_y", Regular.easeOut,targetSubMenu_mc._y, targetSubMenu_mc.hideY, subMenuBtnOverTime, false);
                delete this.onEnterFrame;
            }
        }
        //------------------プルダウン設定終わり
        
        /*
        プルダウン以外のボタンイベントは自分がアクティブのときは動作させない。
        if(active_mc != this)
        */
        if(active_mc != this){
            var overTween:Tween = new Tween(this.over_mc, "_alpha", Regular.easeOut, this.over_mc._alpha, 100, TIME, false);
        }
    }
    
    this["btn" + i + "_mc"].onRollOut = function(){
        if(active_mc != this){
            var outTween:Tween = new Tween(this.over_mc, "_alpha", Regular.easeIn, this.over_mc._alpha, 0, TIME, false);
        }
    }
    this["btn" + i + "_mc"].onRelease = function(){
        if(active_mc != this){
            
            var hidden_mc:MovieClip = active_mc;
            active_mc = this;
            /*
            アクティブを消す処理をして、自分をアクティブに設定
            cngContents(this.link);
            で、自分に設定されたリンクを引数にcngContents()を実行。
            */
            var outTween:Tween = new Tween(hidden_mc.over_mc, "_alpha", Regular.easeIn, hidden_mc.over_mc._alpha, 0, TIME, false);
            _parent.cngContents(this.link);
        }
    }
    
    //サブメニューのイベントハンドラ
    for(r = 0 ; r < subMenu_mc.count ; r++){
        subMenu_mc["btn" + r + "_mc"].over_mc._width = 0;
        subMenu_mc["btn" + r + "_mc"].prm = r;
        
        subMenu_mc["btn" + r + "_mc"].onRollOver = function(){
            if(activeSubMenu_mc != this){
                var overTween:Tween = new Tween(this.over_mc, "_width", Regular.easeOut, this.over_mc._width, 100, subMenuBtnOverTime, false);
            }
        }
        
        subMenu_mc["btn" + r + "_mc"].onRollOut = function(){
            if(activeSubMenu_mc != this){
                var outTween:Tween = new Tween(this.over_mc, "_width", Regular.easeOut, this.over_mc._width, 0, subMenuBtnOverTime, false);
            }
        }
        
        subMenu_mc["btn" + r + "_mc"].onRelease = function(){
            if(activeSubMenu_mc != this){
                var hiddenSubMenu_mc:MovieClip = activeSubMenu_mc;
                activeSubMenu_mc = this;
                var outTween:Tween = new Tween(hiddenSubMenu_mc.over_mc, "_width", Regular.easeOut, hiddenSubMenu_mc.over_mc._width, 0, subMenuBtnOverTime, false);
                
                /*
                if(this._parent.prm == active_mc.prm)
                this._parentはsubMenu_mc["btn" + r + "_mc"]の_parentなのでsubMenu_mcつまりプルダウンをひとまとめにしてるMCなので
                メニューのprmとプルダウンのprmが同じ値が入っているため、active_mcのprmを比べて、おなじだったら読み込み処理をせず
                読み込んだSWFファイルの中のタブのonReleaseイベントを呼び出す。
                その際、サブメニューのprmと読み込んだSWFファイルのインスタンス名の中に入れる数値を対応させておく。
                */
                if(this._parent.prm == active_mc.prm){
                    _root.vew_mc["tab" + this.prm + "_mc"].btn_mc.onRelease();
                }else{
                    /*
                    サブメニューが押されたら、読み込み処理をする前に
                    _root.selectTab = this.prmで選ばれたタブ番号を設定してやり、読み込んだSWFファイルがわからその値を参照する。
                    そのため、ここの処理は、あくまでタブ番号を設定し、対応するメニューボタンのonReleaseイベントを呼び出すだけ。
                    */
                    _root.selectTab = this.prm;
                    this._parent._parent["btn" + this._parent.prm + "_mc"].onRollOver();
                    this._parent._parent["btn" + this._parent.prm + "_mc"].onRelease();
                }
            }
        }
    }
}

function btnEnable(stat:Boolean){
    for(i = 0 ; i < btnCount ; i++){
        this["btn" + i + "_mc"].enabled = stat;
    }
}

BitmapDataによる、波打つエフェクト
 
Hakuhinさんのサイトからソースを頂いてちょっとだけカスタマイズ。
 
ソースはこちら

プロフィール

HN.NoBody

NoBody

市ヶ谷のとあるオフィスでFlashクリエイターとして労役中。
なんとなくチーフ。

twitterでつぶやき中