花火 【後編】

花火のアクションの作り方の後編です
【前編】はこちら

新規シンボルの作成からムービークリップ、ActionScriptに書き出しにチェックを入れ、クラス名をExplosionに

Explosionシンボルのレイヤー1の1フレーム目に爆発のActionScriptを記述

var count:uint = 35;    //火花の数
var sparkArray:Array = new Array();

for (var i:uint=0; i<count; i++) {

    var spark:Particle = new Particle();

    addChild(spark);
    sparkArray.push(spark);    //配列に格納

    //火花の向き設定
    var degree:uint = Math.random()*360;
    sparkArray[i].rotation = degree;

}

まずは火花を複数個配置し、各々違う方向を向くように設定

var count:uint = 35;    //火花の数
var sparkArray:Array = new Array();

for (var i:uint=0; i<count; i++) {

    var spark:Particle = new Particle();
    var velocity = Math.random()*0.5+2.5;    //火花の速度設定

    addChild(spark);
    sparkArray.push(spark);    //配列に格納

    //火花の向き設定
    var degree:uint = Math.random()*360;
    sparkArray[i].rotation = degree;
    var rad = (degree-90) * Math.PI /180;    //角度を90度変えてラジアンに

    //火花が向いたほうに進むようにX方向とY方向の移動量設定
    sparkArray[i].speedX = velocity * Math.cos(rad);
    sparkArray[i].speedY = velocity * Math.sin(rad);
}

//火花の動き
addEventListener(Event.ENTER_FRAME,movespark);
function movespark(event:Event):void {
    for (i=0; i<count; i++) {

        //火花が向いたほうに動く
        sparkArray[i].x += sparkArray[i].speedX;
        sparkArray[i].y += sparkArray[i].speedY;	
    }
}

それぞれの角度からsin、cosでX軸、Y軸の移動量を求め、火花が向いたほうに進むように

var count:uint = 35;    //火花の数
var sparkArray:Array = new Array();

//色設定
var myColor:ColorTransform = new ColorTransform();
myColor.color = 0x1000000 * Math.random();


for (var i:uint=0; i<count; i++) {

    var spark:Particle = new Particle();
    var velocity = Math.random()*0.5+2.5;    //火花の速度設定

    //火花の大きさ設定
    spark.scaleX = Math.random()*0.3+0.5;
    spark.scaleY = Math.random()*0.3+0.5;
    spark.transform.colorTransform = myColor;    //色適用

    addChild(spark);
    sparkArray.push(spark);    //配列に格納

    //火花の向き設定
    var degree:uint = Math.random()*360;
    sparkArray[i].rotation = degree;
    var rad = (degree-90) * Math.PI /180;    //角度を90度変えてラジアンに

    //火花が向いたほうに進むようにX方向とY方向の移動量設定
    sparkArray[i].speedX = velocity * Math.cos(rad);
    sparkArray[i].speedY = velocity * Math.sin(rad);
}

//火花の動き
addEventListener(Event.ENTER_FRAME,moveSpark);
function moveSpark(event:Event):void {
    for (i=0; i<count; i++) {

        //火花が徐々に大きくなるように
        sparkArray[i].scaleX += 0.01;
        sparkArray[i].scaleY += 0.01;

        //火花が向いたほうに動く
        sparkArray[i].x += sparkArray[i].speedX;
        sparkArray[i].y += sparkArray[i].speedY;
        sparkArray[i].alpha -= 0.02;    //徐々に透明に

        //一定以上透明になったら動きと表示をなくす
        if (sparkArray[i].alpha < -0.1) {
            removeEventListener(Event.ENTER_FRAME,moveSpark);
            sparkArray[i].visible = false;
        }
    }
}

色や大きさ、透明度の設定を追加

これで爆発のアクションができました
これを前回つくった打ち上げのアクションと関連付けします

シーン1に戻って、打ち上げの動作を記述したアクションパネルを開き下記のように追加

//打ち上げのタイマー設定
var myTimer:Timer = new Timer(800);
myTimer.start();
myTimer.addEventListener(TimerEvent.TIMER, timerHandler);

//打ち上げ動作の初期設定
function timerHandler(event:TimerEvent):void {

    var firework:Particle = new Particle();
    //初期位置設定
    firework.x = Math.random() * stage.stageWidth;
    firework.y = stage.stageHeight;
    //大きさ設定
    firework.scaleX = 0.5;
    firework.scaleY = 0.5;
    //速度設定
    firework.speedY = (-1) * Math.random() * 2 - 2;
    addChild(firework);

    //打ち上げ動作開始
    firework.addEventListener(Event.ENTER_FRAME, takeOff);

    //打ち上げから爆発までのタイマー設定
    var timer:Timer = new Timer(2000,1);
    timer.start();

    //爆発動作読み込み
    timer.addEventListener(TimerEvent.TIMER_COMPLETE, explode);
    function explode(event:TimerEvent):void {

        var explosion:Explosion = new Explosion();
        addChild(explosion);

        //爆発を取り除くタイマー設定
        var t:Timer = new Timer(2000,1);
        t.start();
        //一定時間で爆発除去
        t.addEventListener(TimerEvent.TIMER_COMPLETE, remove);
        function remove(event:TimerEvent):void {
            removeChild(explosion);
        }

        //爆発が始まったら打ち上げ動作取り消し
        firework.removeEventListener(Event.ENTER_FRAME,takeOff);
        removeChild(firework);

        //爆発の開始位置
        explosion.x = firework.x;
        explosion.y = firework.y;
    }
}

//打ち上げ動作設定
function takeOff(e:Event):void {
    var firework:MovieClip = MovieClip(e.target);
    firework.alpha -= 0.017;    //徐々に透明に
    firework.y += firework.speedY;    //上に動く動き
}

打ち上げが始まってから爆発までをタイマーで設定して
時間がきたら打ち上げの火花があった位置に爆発が起きるように設定

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

以上花火のアクションの作り方でした