Help us understand the problem. What is going on with this article?

[phina.js-Tips] 任意のタイミングからゲームの経過秒数をカウントする

More than 3 years have passed since last update.

※これまでのTipsはphina.js Tips集にまとめています。

今回のTips

以前の[phina.js-Tips-46] ゲームの経過秒数を取得するで、ゲームの経過秒数を取得する方法について説明しました。これは簡単な方法ではありますが、アプリケーションが開始された直後からカウントされるので、例えばタイトル画面から遷移後にカウントを表示すると既に何秒か経過した後の数字になってしまいます。
今回はこれを回避する方法について書きます。

deltatime.gif

[runstantで動作確認]

app.deltaTimeプロパティ

    // 経過時間管理用変数
    var time = 0;
    // 更新処理
    this.update = function(app) {
      // 経過時間更新
      time += app.deltaTime;
      // 経過秒数表示
      label.text = '経過秒数:' + Math.floor(time / 1000);
    };
  • update関数の引数appdeltadTimeプロパティで、前の1フレームにかかった時間を得ることができます。
  • 管理用の変数を用意して、更新処理でdeltaTimeを加算していけば、結果的にその値が経過時間となります。

サンプルコード

// グローバルに展開
phina.globalize();
/*
 * メインシーン
 */
phina.define("MainScene", {
  // 継承
  superClass: 'DisplayScene',
  // コンストラクタ
  init: function() {
    // 親クラス初期化
    this.superInit();
    // ラベル
    var label = Label({
      text: '',
      fontSize: 48,
      x: this.gridX.center(),
      y: this.gridY.center(),
    }).addChildTo(this);
    // 経過時間管理用変数
    var time = 0;
    // 更新処理
    this.update = function(app) {
      // 経過時間更新
      time += app.deltaTime;
      // 経過秒数表示
      label.text = '経過秒数:' + Math.floor(time / 1000);
    };
  },
});
/*
 * メイン処理
 */
phina.main(function() {
  // アプリケーションを生成
  var app = GameApp({
    title: '経過秒数表示',
  });
  // 実行
  app.run();
});
alkn203
javascriptのゲームライブラリphina.jsを愛用している趣味プログラマ。ファミコン世代。 Hobbyist programmer javascript/html5/phina.js/retro games
http://qiita.com/alkn203/items/bca3222f6b409382fe20
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away