花火 【前編】

もう夏ということで花火のアクションの作り方です
これも２回にわけていきます
解説はつづきから

新規ファイル作成
ステージ設定はサイズを400×300、フレームレートは30に
作業しやすいように背景を黒に

まずは背景から
レイヤー１に上図のように400×300の矩形を描きグラデーションをかける
色は上が#03050A、下が#1B234A

新規シンボル作成から上図のように設定
リンケージ、ActionScriptに書き出しにチェックを入れてクラス名をParticleに

作成したシンボルに上図のような図形を描く
色は#FFFFFF、サイズは5×18

シーン1に戻り、新規レイヤーを追加しActionScriptを記述
まずは打ち上げの光を設置

//打ち上げのタイマー設定
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);
}

タイマーを設定しておいて一定時間ごとに花火を打ち上げ

次にこの設置した花火に動きをつける

/打ち上げのタイマー設定
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);
}

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

これでムービープレビューすると上図のように一定時間ごとに打ち上げのアニメーションが出来てるかと思います

つづきは次回

【後編】へつづく