3. ActionScriptのシンタックス／3.8 インタ-バル
3.8 インタ-バル
一定時間刻みで繰り返す
アニメーションを行うといった場合には、onEnterFrameイベントハンドラを利用して繰り返しの処理を実行するのが一般的な方法です。しかし、繰り返しの処理は必ずonEnterFrameイベントハンドラから呼び出さなければならないとしたらスクリプトを書くうえで窮屈です。また、onEnterFrameイベントハンドラでは処理のタイミングがムービークリップのフレームレートに左右されてしまうという不都合もあります。
setInterval()関数を使えばonEnterFrameイベントハンドラを使わずに繰り返しの処理を行うことができ、また、時計の秒針移動のように正確なタイミングで動きを制御したい場合やフレームレートとはまったく違うタイミングの繰り返し処理を行うこともできます。
たとえば次のステートメントを実行すると、myObjオブジェクトのmyMethod()メソッドを2秒間隔で呼び出すようになります。intervalIDにはこのインターバルの設定をキャンセルするためのidが入ります。
intervalID = setInterval(myObj, "myMethod", 2000);
myMethod()メソッドの実行の際にパラメータを渡すこともできます。パラメータがv1, v2ならば次のように書きます。
intervalID = setInterval(myObj, "myMethod", 2000, v1, v2);
インターバルをキャンセルするには、clearInterval(intervalID)を実行します。intervalIDは、setInterval()を実行したときに戻ってくる値です。
clearInterval(intervalID);
note:
setInterval()には対象となるオブジェクトを省略する書式もあります。
インスタンスのメソッドを実行する
では実際にインターバルを利用した例を見てみましょう。メインのタイムラインにmyMCインスタンスを作り、フレーム１に次のフレームアクションを書き込みます。
このムービーをパブリッシュすると、myMCインスタンスのkaitenメソッドが2秒間隔で呼び出されるようになり、結果として2秒間隔で時を刻むように10度ずつ回転します。
sample→interval.fla
フレームアクション：
//実行するイベントハンドラを設定する
myMC.kaiten = function(d:Number) {
this._rotation += d;
};
//myMCインスタンスのkaitenメソッドを2秒間隔で実行
intervalID = setInterval(myMC, "kaiten", 2000, 10);
図3-8-1 2秒間隔で時を刻むように10度ずつ回転します。
setInterval()はムービークリップシンボルのインスタンスのメソッドを呼び出すのではなく、クラス定義から生成したインスタンスのメソッドや関数を呼び出すためにも利用します。
一定時間を待つ
インターバルは一定時間間隔で繰り返しの処理を行いたいときに威力を発揮する機能ですが、一定時間を待つタイマーとしても利用できます。
次のサンプルを実行すると5秒後にインターバルで設定したtimeoutイベントが発生するので、そこでインターバルの設定をクリアします。
sample→timer1.fla
フレームアクション：
//timerObjオブジェクトの設定
timerObj = new Object();
timerObj.timeout = function() {
clearInterval(timerID); // インターバルの終了
trace("タイムアウト"); // 出力→ タイムアウト
};
//計測開始（5秒でタイムアウト）
var timerID = setInterval(timerObj, "timeout", 5000);
次のサンプルでは、ステージをクリックした時点から1秒間隔でカウントダウンを行います。カウントダウンの秒数はダイナミックテキストmsgFldに表示しています。
例に示すように10秒のカウントダウンを行いたいならばmyObj.startTimer(10)のように10を引数にしてstartTimer()メソッドを実行します。インターバルは1秒間隔でtimestepイベントを実行するので、10回カウントしたならば10秒経過になるので、そこでインターバルをクリアします。
sample→timer2.fla
フレームアクション：
msgFld.text = "ステージをクリックするとカウントダウンを開始します"
myObj = new Object();
myObj.startTimer = function(sec:Number) {
this.cntdowntimer = sec;
this.timerID = setInterval(this, "timestep", 1000);// インターバルの設定
msgFld.text = this.cntdowntimer + "秒";
};
myObj.timestep = function() {
if (this.cntdowntimer > 1) {
--this.cntdowntimer;//カウントダウン
msgFld.text = this.cntdowntimer + "秒";//表示
} else {
clearInterval(this.timerID);// インターバルのクリア
msgFld.text = "タイムアウトしました";
}
};
//10秒間のカウントダウンスタート
this.onMouseDown = function() {
myObj.startTimer(10);
};