Flashゲームプログラミング講座 for ActionScript3.0


タイマーについて



・Timer クラスについて
・JavaScript 互換 API について
・フレーム更新時に、任意の関数を実行する

前のページに戻る

　

Timer クラスについて

　

サンプルをダウンロード
timer_00_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
■Timer クラスについて
■Timerクラスの基本的な使い方について
■関数の実行回数を取得する
■関数の実行回数をリセットする
■タイマー利用時の再描画について
　


■Timer クラスについて


Timer クラスを使用すると、指定した時間隔で、任意の関数を繰り返し実行する事ができます。
　
Timer クラスの実行タイミングは、フレームレートの更新間隔とは異なります。
　
特に、描画と関係のない処理を行うのに最適です。
　
指定した時間が経過すると、同期的に関数が呼び出されます。
　
マルチスレッド実行ではありません。
　
処理落ちが発生すると、次の関数の実行のタイミングも遅れます。
　
関数内で無限ループ処理を作ってしまうと、全体の処理も停止します。
　
■実行タイミングについて
　
必ずしも、指定した時間間隔で実行されるとは限りません。
　
例えば、Flash Player が隠れている場合、レートは、約 2 ～ 8 fps まで低下します。
　
省電力化（スロットル）については、こちらで解説しています。
　
また、Flash Player 10.1 以降から、タイマー周波数の上限が、約 60 fps になりました。
　
よって、約 16 ミリ秒が最短となります。
　
公式リファレンスでは、20 ミリ秒未満の指定は、非推奨となっています。
　

Timerクラスの基本的な使い方について

　
１．Timerクラスをインスタンス化する

new 演算子を使って、Timer クラスをインスタンス化します。
　
引数で指定する値は、後から変更する事もできます。
　
new Timer ( 実行時間隔 , 繰り返す回数 ) :Timer
第01引数 Number関数を実行する時間隔をミリ秒で指定します。
第02引数(略可)int繰り返す実行回数を指定します。0 を指定した場合、無制限です。デフォルトは 0
戻り値 TimerTimer オブジェクト
　
100ミリ秒の時間隔で実行される Timer オブジェクトを作成する

import flash.utils.Timer;


// ------------------------------------------------------------
// タイマーオブジェクトを作成（100ミリ秒の時間隔で、無制限に繰り返す）
// ------------------------------------------------------------
var timer : Timer = new Timer(100);

// 出力テスト
trace(timer);
　
3000ミリ秒の時間隔で、1回だけ実行される、Timer オブジェクトを作成する

import flash.utils.Timer;


// ------------------------------------------------------------
// タイマーオブジェクトを作成（3000ミリ秒の時間隔で、1回だけ実行）
// ------------------------------------------------------------
var timer : Timer = new Timer(3000,1);

// 出力テスト
trace(timer);
　
Timer オブジェクトを作成した後で、タイマーの設定を行う

import flash.utils.Timer;


// ------------------------------------------------------------
// タイマーオブジェクトを作成
// ------------------------------------------------------------
var timer : Timer = new Timer(0);

// ------------------------------------------------------------
// タイマーの設定
// ------------------------------------------------------------
// 関数を実行する時間隔をミリ秒で指定
timer.delay = 3000;

// タイマー完了回数を設定
timer.repeatCount = 1;

// 出力テスト
trace(timer);
　
２．実行したい関数を登録する

Timer クラスは、以下のイベントに対応しています。
　
イベント定数 解説
TimerEvent.TIMER 指定した時間隔で、繰り返し実行されるイベント
TimerEvent.TIMER_COMPLETE 指定した回数をすべて消化したときに 1 度だけ実行されるイベント
　
３．タイマーを開始する

タイマーを開始するには、start() メソッドを使用します。
　
タイマーを開始する

import flash.utils.Timer;
import flash.events.TimerEvent;


// ------------------------------------------------------------
// タイマーオブジェクトを作成（1000ミリ秒の時間隔で、10回実行）
// ------------------------------------------------------------
var timer:Timer = new Timer(1000,10);

// ------------------------------------------------------------
// 指定した時間隔で、繰り返し実行されるイベント
// ------------------------------------------------------------
timer.addEventListener(TimerEvent.TIMER,function (e:TimerEvent):void{

	trace("タイマー繰り返し実行:" + timer.currentCount);

});

// ------------------------------------------------------------
// 指定した回数をすべて消化したときに実行されるイベント
// ------------------------------------------------------------
timer.addEventListener(TimerEvent.TIMER_COMPLETE,function (e:TimerEvent):void{

	trace("タイマー完了");

});

// ------------------------------------------------------------
// タイマーを開始する
// ------------------------------------------------------------
timer.start();
　
４．タイマーを終了する

タイマーを途中で終了したい場合は、stop() メソッドを呼び出します。
　
停止すると、カウント数はそのまま残ります。
　
カウント数をリセットするには、reset() メソッドを使用します。
　
マウスの左ボタンを押すと、タイマーを停止する

import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.events.MouseEvent;


// ------------------------------------------------------------
// タイマーオブジェクトを作成（1000ミリ秒の時間隔で、無制限に繰り返す）
// ------------------------------------------------------------
var timer:Timer = new Timer(1000);

// ------------------------------------------------------------
// 指定した時間隔で、繰り返し実行されるイベント
// ------------------------------------------------------------
timer.addEventListener(TimerEvent.TIMER,function (e:TimerEvent):void{

	trace("タイマー繰り返し実行:" + timer.currentCount);

});

// ------------------------------------------------------------
// タイマーを開始する
// ------------------------------------------------------------
timer.start();

// ------------------------------------------------------------
// マウスの左ボタンを押すと実行されるイベント
// ------------------------------------------------------------
stage.addEventListener(MouseEvent.MOUSE_DOWN , function (e:MouseEvent):void{

	// タイマー停止
	timer.stop();

});
　

■関数の実行回数を取得する


Timer クラスには、以下のプロパティがあります。
　
プロパティ名型説明
delayNumber関数を実行する時間隔をミリ秒で指定する。
currentCountintコールバック関数が実行されたカウント数を取得する。
repeatCountintタイマー完了回数を設定する。
runningBooleanタイマーの実行状態を取得する。タイマーが停止していれば false
　
タイマーの実行回数を取得する

import flash.utils.Timer;
import flash.events.TimerEvent;


// ------------------------------------------------------------
// タイマーオブジェクトを作成（1000ミリ秒の時間隔で、10回実行）
// ------------------------------------------------------------
var timer:Timer = new Timer(1000,10);

// ------------------------------------------------------------
// 指定した時間隔で呼び出されるイベント
// ------------------------------------------------------------
timer.addEventListener(TimerEvent.TIMER,function (e:TimerEvent):void{

	// 実行された回数を取得
	var current_count:int = timer.currentCount;

	// タイマー完了回数を取得
	var repeat_count:int = timer.repeatCount;

	// 出力テスト
	trace("タイマー: " + current_count + " / " + repeat_count);

});

// ------------------------------------------------------------
// タイマー開始
// ------------------------------------------------------------
timer.start();
　

■タイマーに登録した関数の実行回数をリセットする


関数の実行回数を 0 に戻したい場合は、reset() メソッドを使用します。
　
このメソッドを呼び出すと、タイマーは停止します。
　
マウスの左ボタンを押すと、タイマーをリセットする

import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.events.MouseEvent;


// ------------------------------------------------------------
// タイマーオブジェクトを作成（1000ミリ秒の時間隔で、10回実行）
// ------------------------------------------------------------
var timer:Timer = new Timer(1000,10);

// ------------------------------------------------------------
// 指定した時間隔で呼び出されるイベント
// ------------------------------------------------------------
timer.addEventListener(TimerEvent.TIMER,function (e:TimerEvent):void{

	trace("タイマー: " + timer.currentCount + " / " + timer.repeatCount);

});

// ------------------------------------------------------------
// マウスの左ボタンを押すと実行されるイベント
// ------------------------------------------------------------
stage.addEventListener(MouseEvent.MOUSE_DOWN , function (e:MouseEvent):void{

	// タイマーをリセット
	timer.reset();

	// タイマー開始
	timer.start();
});
　

■タイマー利用時の再描画について

　
タイマーの実行タイミングは、フレームレートの更新間隔とは異なります。
　
再描画が発生しない事に注意して下さい。
　
例えば、コールバック関数内から、表示オブジェクトを操作してもすぐに画面に反映されません。
　
実際の描画は、次のフレームの更新タイミングで行われます。
　
手動的に再描画したい場合は、updateAfterEvent() メソッドを使用します。
　
スプライトを円のように移動させる

import flash.display.Sprite;
import flash.display.Graphics;
import flash.utils.Timer;
import flash.events.TimerEvent;


// ------------------------------------------------------------
// スプライトを初期化
// ------------------------------------------------------------
// スプライトを作成する
var sprite:Sprite = new Sprite();

// ステージにスプライトを登録する
stage.addChild(sprite);

// 矩形をレンダリングする
var g:Graphics = sprite.graphics;
g.lineStyle (5, 0xAA0000, 1.0);
g.beginFill (0xFF4444, 1.0);
g.drawRect (-20,-20,40,40);

var px:Number = 200;		// 円の中心 x 座標
var py:Number = 150;		// 円の中心 y 座標
var rot:Number = 0;		// 円の角度(0 ～ 360)
var rot_speed:Number = 1;	// 円の角度変化量(0 ～ 360)
var radius:Number = 30;		// 円の半径

// ------------------------------------------------------------
// タイマーオブジェクトを作成
// ------------------------------------------------------------
var timer:Timer = new Timer(0);

// ------------------------------------------------------------
// 指定した時間隔で実行されるイベント
// ------------------------------------------------------------
timer.addEventListener(TimerEvent.TIMER,function (e:TimerEvent):void{

	// 角度を変化させる
	rot += rot_speed;

	// 角度からラジアンに返還する
	var rad:Number = rot * Math.PI / 180;

	var x:Number = px + Math.cos(rad) * radius;
	var y:Number = py + Math.sin(rad) * radius;

	// 座標をインスタンスの座標に反映
	sprite.x = x;
	sprite.y = y;

	// 描画を更新
	e.updateAfterEvent();
});


// タイマー開始
timer.start();
　
　
上に戻る

　

JavaScript 互換 API について

　
■ setTimeout() 関数について
■ clearTimeout() 関数について
■ setInterval() 関数について
■ clearInterval() 関数について
　


■一定時間経過後に、任意の関数を実行する


一定時間経過後に、任意の関数を１回だけ実行するには、setTimeout() メソッドを使用します。
　
このメソッドは非同期実行です。
　
すぐに制御が返り、プログラムは動き続けます。
　
中止したい場合は、clearTimeout() メソッドを使用します。
　
setTimeout( 関数 , 時間 , データ ... ) :uint
第01引数 Function実行したいコールバック関数を指定。
第02引数 Numberコールバック関数を実行するまでに待機する時間を指定（単位：ミリ秒）
可変引数(略可)*コールバック関数の引数に、任意のデータを渡したい場合に指定。
戻り値 uintハンドル値が得られる。
　
■第02引数（待機する時間）
　
コールバック関数が実行されるまでに、待機する時間をミリ秒で指定します。
　
必ずしも、指定した時間経過後に実行されるとは限りません。
　
例えば、Flash Player が隠れている場合、最短でも約 125 ミリ秒後に実行されます。
　
省電力化（スロットル）については、こちらで解説しています。
　
また、Flash Player 10.1 以降から、タイマー周波数の上限が、約 60 fps になりました。
　
よって、約 16 ミリ秒が最短となります。
　
公式リファレンスでは、20 ミリ秒未満の指定は、非推奨となっています。
　
■使用例
　
5000 ミリ秒経過後に,関数を実行する

import flash.utils.setTimeout;


// ------------------------------------------------------------
// 一定時間経過後に実行される関数
// ------------------------------------------------------------
function TimeoutFunc() :void{
	trace("実行された");
}

// ------------------------------------------------------------
// 5000 ミリ秒経過後に、関数を実行する
// ------------------------------------------------------------
var timeout_id:uint = setTimeout(TimeoutFunc , 5000);
　
第03引数の動作を確認する

import flash.utils.setTimeout;


// ------------------------------------------------------------
// 一定時間経過後に実行される関数
// ------------------------------------------------------------
function TimeoutFunc(argument1:*,argument2:*,argument3:*) :void{

	// 出力テスト
	trace(argument1); // false
	trace(argument2); // 123
	trace(argument3); // "あいう"
	trace(arguments);
}

// ------------------------------------------------------------
// 1000 ミリ秒経過後に、関数を実行する
// ------------------------------------------------------------
var timeout_id:uint = setTimeout(TimeoutFunc , 1000 , false , 123 , "あいう");
　

■setTimeout() メソッドの動作をキャンセルする

　
setTimeout() メソッドの動作をキャンセルするには、clearTimeout() メソッドを使用します。
　
clearTimeout( ハンドル値 ) :void
第01引数 uintsetTimeout() メソッドで得られたハンドル値を指定。
戻り値 voidなし。
　
setTimeout() メソッドのタイマー動作をキャンセルする

import flash.utils.setTimeout;
import flash.utils.clearTimeout;


// ------------------------------------------------------------
// 変数
// ------------------------------------------------------------
var timeout_id:uint;

// ------------------------------------------------------------
// 5000 ミリ秒経過後に、関数を実行する
// ------------------------------------------------------------
timeout_id = setTimeout(function () :void{

	trace("実行された");

} , 5000);

// ------------------------------------------------------------
// タイマーを停止する
// ------------------------------------------------------------
if(timeout_id){

	// setTimeout() メソッドの動作をキャンセルする
	clearTimeout(timeout_id);

	timeout_id = 0;
}
　

■一定の時間間隔で、任意の関数を実行する


一定の時間間隔で、任意の関数を繰り返し実行するには、setInterval() メソッドを使用します。
　
このメソッドは非同期実行です。
　
すぐに制御が返り、プログラムは動き続けます。
　
中止したい場合は、clearInterval() メソッドを使用します。
　
setInterval( 関数 , 時間隔 , データ ... ) :uint
第01引数 Function実行したいコールバック関数を指定。
第02引数 Number関数を繰り返し実行するための時間隔を指定（単位：ミリ秒）
可変引数(略可)*コールバック関数の引数に、任意のデータを渡したい場合に指定。
戻り値 uintハンドル値が得られる。
　
■実行タイミングについて
　
必ずしも、指定した時間間隔で実行されるとは限りません。
　
例えば、Flash Player が隠れている場合、レートは、約 2 ～ 8 fps まで低下します。
　
省電力化（スロットル）については、こちらで解説しています。
　
また、Flash Player 10.1 以降から、タイマー周波数の上限が、約 60 fps になりました。
　
よって、約 16 ミリ秒が最短となります。
　
公式リファレンスでは、20 ミリ秒未満の指定は、非推奨となっています。
　
■使用例
　
5000 ミリ秒の時間隔で関数を実行する

import flash.utils.setInterval;


// ------------------------------------------------------------
// 一定時間隔で、繰り返し実行される関数
// ------------------------------------------------------------
function IntervalFunc() :void{
	trace("実行された");
}

// ------------------------------------------------------------
// 5000 ミリ秒の時間隔で関数を実行する
// ------------------------------------------------------------
var interval_id:uint = setInterval(IntervalFunc , 5000);
　
第03引数の動作を確認する

import flash.utils.setInterval;


// ------------------------------------------------------------
// 一定時間経過後に実行される関数
// ------------------------------------------------------------
function IntervalFunc(argument1:*,argument2:*,argument3:*) :void{

	// 出力テスト
	trace(argument1); // false
	trace(argument2); // 123
	trace(argument3); // "あいう"
	trace(arguments);
}

// ------------------------------------------------------------
// 1000 ミリ秒の時間隔で関数を実行する
// ------------------------------------------------------------
var interval_id:uint = setInterval(IntervalFunc , 1000 , false , 123 , "あいう");
　

■setInterval() メソッドの動作をキャンセルする

　
setInterval() メソッドの動作をキャンセルするには、clearInterval() メソッドを使用します。
　
clearInterval( ハンドル値 ) :void
第01引数 uintsetInterval() メソッドで得られたハンドル値を指定。
戻り値 voidなし。
　
setInterval() メソッドのタイマー動作をキャンセルする

import flash.utils.setInterval;
import flash.utils.clearInterval;


// ------------------------------------------------------------
// 変数
// ------------------------------------------------------------
var interval_id:uint;

// ------------------------------------------------------------
// 5000 ミリ秒の時間隔で関数を実行する
// ------------------------------------------------------------
interval_id = setInterval(function () :void{

	trace("実行された");

} , 5000);

// ------------------------------------------------------------
// タイマーを停止する
// ------------------------------------------------------------
if(interval_id){

	// setInterval() メソッドの動作をキャンセルする
	clearInterval(interval_id);

	interval_id = 0;
}
　
　
上に戻る

　

フレーム更新時に、任意の関数を実行する

　
■エンターフレームイベントについて
■ Event.ENTER_FRAME イベント
　


■エンターフレームイベントについて


エンターフレームイベントを使用すると、Flash Player に設定したフレームレートの時間隔で、任意の関数を実行する事ができます。
　
エンタフレームイベントの発火のタイミングは、フレームの更新と一致します。
　
すなわち、Flash Player の再描画タイミングと一致します。
　
表示オブジェクトの制御や、描画に関する処理は、エンターフレームイベント内で処理した方が効率がいいでしょう。
　
ActionScript3.0 では、フレームレート値を動的に変更する事ができます。
　
フレームレートの制御は、こちらで解説しています。
　

■ Event.ENTER_FRAME イベント


毎フレームごとに、任意の関数を繰り返し実行するには、Event.ENTER_FRAME イベントを使用します。
　
任意の表示オブジェクトに対して、リスナーを登録します。
　
毎フレームごとに、繰り返し実行されるイベント

import flash.display.Sprite;
import flash.events.Event;


// ------------------------------------------------------------
// スプライトを生成する
// ------------------------------------------------------------
var sprite:Sprite = new Sprite();

// ------------------------------------------------------------
// 毎フレームごとに、繰り返し実行されるイベント
// ------------------------------------------------------------
sprite.addEventListener(Event.ENTER_FRAME,function(e:Event) :void{

	trace("実行された");

});
　
■イベントのリッスンを終了する
　
イベントのリッスンを終了するには、removeEventListener() メソッドを使用します。
　
イベントリスナーのリッスンを止める

import flash.display.Sprite;
import flash.events.Event;


// ------------------------------------------------------------
// 毎フレームごとに、繰り返し実行される関数
// ------------------------------------------------------------
function EventEnterFrameFunc(e:Event) :void{

	trace("実行された");

}

// ------------------------------------------------------------
// スプライトを生成する
// ------------------------------------------------------------
var sprite:Sprite = new Sprite();

// ------------------------------------------------------------
// 毎フレームごとに、繰り返し実行されるイベント
// ------------------------------------------------------------
sprite.addEventListener(Event.ENTER_FRAME,EventEnterFrameFunc);

// ------------------------------------------------------------
// リッスンを終了する
// ------------------------------------------------------------
sprite.removeEventListener(Event.ENTER_FRAME,EventEnterFrameFunc);
　
　
上に戻る

　
前のページに戻る