タイマーによるアニメーション
タイマーによるアニメーション
これまで, アニメーションをするには, 1フレーム進むたびに実行される関数を, 各オブジェクトのonEnterFrameプロパティに登録していました.
ここではsetInterval関数を用いて, 一定時間間隔/後の変化を実現してみます. 言ってみればタイマーです. 次のような用途に有効です.
- 5分後(=って何フレーム後?)に突然イベントを起こしたいとき. もちろんonEnterFrame内でカウントアップしていく, 開始時刻をおぼえておいてonEnterFrame内で毎回時刻をチェックする, などの方法もありますが, setIntervalのほうがシンプルです.
- フレームレートと無関係な時間間隔でイベントを起こしたいとき. フレームレートの異なる .fla でも同じ時間が実現できます
var timer1:Object; // タイマーオブジェクト
var timer2:Object;
timer1=new Object();
timer2=new Object();
var timerId1:Number; // タイマーにつける番号
var timerId2:Number;
// 繰り返し実行したいメソッド. 名前は自由(だが下と合わせる)
timer1.repeat = function(){
// 2秒ごとに行いたい処理
trace("2 sec have passed");
};
//2000ミリ秒ごとに, timer1.repeat() を実行せよ. timerId1という番号でおぼえておけ
timerId1=setInterval(timer1,"repeat",2000);
// タイマーを解除したいときは timerId1を使う
timer2.ring = function(){
clearInterval(timerId2); // timerId2 で指定されるタイマーを解除せよ.
// この結果, 繰り返されず実行は1回だけ
// 10秒後に1度だけ行いたい処理
trace("10 sec have passed");
};
// 10000ミリ秒ごとに, timer2.ring() を実行せよ. timerId2という番号でおぼえておけ
timerId2=setInterval(timer2,"ring",10000);
