tmlib.jsでシューティング風なクソゲーを作る03 - 当たり判定を付ける

今回やったこと

前回の続きです。今回は当たり判定を実装します。

今回の仕上がり

以下の3つの判定を実装しました。

• 敵と機雷
• 爆風と機雷
• 爆風と敵

機雷は敵と着弾すると爆発します。爆発には他の機雷を誘爆する効果があります。敵は機雷が着弾するか爆発に巻き込まれると消滅します。これで誘爆による連鎖のような爽快感が出る…かな。

当たり判定の実装

基本的に毎フレーム当たり判定をチェックするだけです。tmlib.jsのtm.app.Elementを継承するクラスにはcollisionというメソッドがあるのですが…使い方がよくわからなかったので、古典的な方法で当たり判定を取りました。例えば機雷と敵との当たり判定はこんな感じです。

  checkBulletAndEnemyHit: function () {
    var self = this;
    var i;
    var deadBullet = [];  // 削除対象の機雷リスト
    var deadEnemy = [];   // 削除対象の敵リスト

    // 機雷と敵の当たり判定をチェックしてヒットしている場合は削除リストにオブジェクトを登録する
    for (i= 0; i<self.bulletList.length; i++) {
      var bullet = self.bulletList[i];
      for (var j=0; j<self.enemyList.length; j++) {
        var enemy = self.enemyList[j];
        if(bullet.isHitElement(enemy)) {
          console.log("hit!! :%d,%d", bullet.x, bullet.y );

          // すでにヒット処理済みの場合は爆風エフェクト発生しないし、削除対象リストに登録しない
          if (bullet.isDead === false) {
            bullet.isDead = true;
            // 爆風エフェクト開始
            var blast = Blast(bullet.x, bullet.y).addChildTo(self.blastPool)
              .startBlast()
              .on("endBlast", function (e) {
                console.log("endBlast");
                self.blastList.erase(e.target);
              });

            self.blastList.push(blast);

            deadBullet.push(bullet);
          }
          // すでにヒット処理済みの場合は削除対象リストに登録しない
          if (enemy.isDead === false) {
            enemy.isDead = true;
            deadEnemy.push(enemy);
          }
        }
      }
    }

    // 削除対象の機雷と敵を削除
    for (i=0; i<deadBullet.length; i++) {
      deadBullet[i].remove();
      self.bulletList.erase(deadBullet[i]);
    }
    for (i=0; i<deadEnemy.length; i++) {
      deadEnemy[i].remove();
      self.enemyList.erase(deadEnemy[i]);
    }
    self.renewEnemy();
  }

単純にループで走査して総当りでチェックです。コードの全体はjsdo.itで確認してください。これでようやくゲームの遊び部分の基礎工事ができたかなと。スプライトをほぼ使っていないので見た目がヒドイですが…。

次回やること

敵の出現パターンとかは後々考えるとして次はゲームの終了条件を設定したいと思います。冗長なコードの修正は最後にやろうと思います。