CreateJSで作ったシューティングゲームの弾が発射されません。

JS、createJS、htmlでのシューティングゲームを作った際のコードです。
スペースキーを押しても弾が発射されないのでcodeのおかしなところを教えてくださいーー

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>
  <!-- <script src="js/jquery-2.1.3.min.js"></script> -->
  <!-- <link rel="stylesheet" href="css/sample.css"> -->
  <title>ゲーム開発</title>
  <script>
  window.addEventListener("load", init);
  function init() {
    var stage = new createjs.Stage("myCanvas");
    var enemyList = []; //敵の配列
    var bulletList = []; //発射弾の配列
    var count = 0; //フレーム番号
    var scoreNum = 0; //スコア
    var STAGE_W = 1300; //画面サイズ
    var STAGE_H = 700; //
    var bg = new createjs.Shape();
    bg.graphics.beginFill("black").drawRect(0, 0, STAGE_W, STAGE_H);
    stage.addChild(bg);
    // 自機を作成
    var player = new createjs.Shape();
    player.graphics.beginFill("white").moveTo(5, 0).lineTo(-10, +5).lineTo(-10, -5).closePath();
    stage.addChild(player);
    //スコア欄を作成
    var score = new createjs.Text("", "24px sans-serif", "white");
    stage.addChild(score);
    //キーボードが押されてるかの判定
    var isPressSpace = false;
  //マウスイベントの登録
  // stage.addEventListener("click", handleClick);
  window.addEventListener("keydown", handleKeyDown);
  window.addEventListener("keyup", handleKeyUp);
  function handleKeyDown(event) {
    //キーコードを取得
    var keyCode = event.keyCode;
    if (keyCode == 32) {// スペース
      isPressSpace = true; //真偽値が切り替わる
    }
  }
  function handleKeyUp(event) {
    //キーコードを取得
    var keyCode = event.keyCode;
    if (keyCode == 32) {//スペース
      isPressSpace = false; //真偽値の切り替え
    }
  }
  //tickイベントの登録
  createjs.Ticker.setFPS(60);
  createjs.Ticker.addEventListener("tick", handleTick);
  function handleTick(event) {
    if(isPressSpace == true) {
      bullet.graphics.beginFill("white").drawCircle(0, 0, 3);
      bullet.x = player.x;
      bullet.y = player.y;
      stage.addChild(bullet); //画面に表示
      bulletList.push(bullet); //配列に保存
    }
  }

  //tick イベントの登録
  // createjs.Ticker.setFPS(60);
  // createjs.Ticker.addEventListener("tick", handleTick);
  //クリックした時の処理
  // function handleClick(event) {
  //   var bullet = new createjs.Shape();
  //   bullet.graphics.beginFill("white").drawCircle(0, 0, 3);
  //   bullet.x = player.x;
  //   bullet.y = player.y;
  //   stage.addChild(bullet); //画面に表示
  //   bulletList.push(bullet); //配列に保存
  // }
  //tickイベントの処理
  function handleTick() {
    //自機をマウスの座標まで移動させる（原則で移動）
    player.x += (stage.mouseX - player.x) * 0.1;
    player.y += (stage.mouseY - player.y) * 0.1;
    //フレーム番号を更新
    count = count + 1;
    //60回フレームに1回敵を生成
    if (count % 200 == 0) {
      var enemy = new createjs.Shape();
      enemy.graphics.beginFill("red").moveTo(-5, 0).lineTo(+10, +5).lineTo(+10, -5).closePath();
      enemy.x = STAGE_W;
      enemy.y = STAGE_H * Math.random();
      stage.addChild( enemy); //画面に表示
      enemyList.push(enemy); //配列に保存
    }
    //発射弾の移動処理
    for (var i = 0; i < bulletList.length; i++) {
      bulletList[i].x += 10;
      //画面端まで移動したら
      if (bulletList[i].x > STAGE_W) {
        stage.removeChild(bulletList[i]); //画面から削除
        bulletList.splice( i, 1); //配列から削除
      }
    }
    //敵の移動処理
    for(var i = 0; i < enemyList.length; i++) {
      enemyList[i].x -= 2;
      //画面はじまで移動したら
      if (enemyList[i].x < 0) {
        showGameOver(); //ゲームオーバー処理
      }
    }
    //発射弾と敵の当たり判定
    for(var j = 0; j < enemyList.length; j++) {
      for (var i = 0; i < bulletList.length; i++) {
        var bullet = bulletList[i];
        var enemy = enemyList[j];
        //敵から見た発射弾のローカル座標を取得
        var pt = bullet.localToLocal(0, 0, enemy);
        //当たり判定を行う
        if(enemy.hitTest(pt.x, pt.y) == true) {
          //発射弾の削除
          stage.removeChild(bullet);
          bulletList.splice(i, 1);
          //敵の削除
          stage.removeChild(enemyList[j]);
          enemyList.splice(j, 1);
          //スコアの更新
          scoreNum += 100;
          score.text = String(scoreNum);
          break;
        }
      }
    }
    //stageの更新
    stage.update();
  }
  function showGameOver() {
    alert("ゲームオーバー！ あなたのスコアは " + scoreNum + " でした。 ");
    //各種イベントをまとめて解除
    createjs.Ticker.removeAllEventListeners();
    stage.removeAllEventListeners();
  }
}




  </script>

</head>
<body>
<canvas id="myCanvas" width="1300" height="700"></canvas>
</body>
</html>

行動規範の内容に同意します

回答1件

ベストアンサー

まず第一の問題ですが、handleTickが2回定義されているため、isPressSpaceを判定しているほうのhandleTickは消滅してしまい、Tickerに登録しているhandleTickは自機の動作などを管理しているほうだけ呼ばれています。なので、isPressSpaceの判定処理のあたりをまるごと発射弾の移動処理の前のあたりに移動すればよいです。

第二の問題ですが、clickで動いていたときの弾発射の処理にはあったShapeのnewのコードがなくなっています。これがないとエラーが起きます。

とりあえず以上2点を直したら白い丸い弾が出るようになりました。

投稿2017/04/04 08:57