敵を倒すゲーム FPSを使用's game

Click here for free DL of the app version that can save data.

No:14361

←

Prev Next

→

敵を倒すゲーム FPSを使用
Developer User5934｜Date and time 23/9/1 9:50:28
Build time 24.125 sec｜Game capacity 3.549KB｜

Script

了解です。以下に、スマートフォンで遊べる敵を倒すFPS（ファーストパーソンシューティング）ゲームの実装例を示します。

このプログラムでは、canvas要素を使用してゲームを描画しています。最初にプレイヤー（赤い四角）と敵（青い四角）の情報を設定し、`update`関数でゲームの描画と処理を行っています。プレイヤーの移動はスマートフォンのタッチ操作で行い、敵との当たり判定があるため、敵に触れるとゲームオーバーとなります。（注：FPSゲームに必要な機能の全てを実装するにはもう少し複雑な処理が必要ですが、上記のコードは基本的な機能を実装したシンプルなゲームとなっています。）

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

Click here for free DL of the app version that can save data.

了解です。以下に、スマートフォンで遊べる敵を倒すFPS（ファーストパーソンシューティング）ゲームの実装例を示します。

```html
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>敵を倒すFPSゲーム</title>
  <style>
    #game-container {
      width: 100vw;
      height: 100vh;
      background-color: black;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <canvas id="game-canvas"></canvas>
  </div>

const player = {
        x: canvas.width / 2 - playerSize / 2,
        y: canvas.height / 2 - playerSize / 2,
        width: playerSize,
        height: playerSize,
        color: 'red'
      };

const enemies = [];      
      for (let i = 0; i < enemyCount; i++) {
        enemies.push({
          x: Math.random() * (canvas.width - enemySize),
          y: Math.random() * (canvas.height - enemySize),
          width: enemySize,
          height: enemySize,
          color: 'blue'
        });
      }

const update = () => {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        
        // プレイヤーの描画
        ctx.fillStyle = player.color;
        ctx.fillRect(player.x, player.y, player.width, player.height);
        
        // 敵の描画
        enemies.forEach((enemy) => {
          ctx.fillStyle = enemy.color;
          ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);

// プレイヤーと敵の当たり判定
          if (player.x < enemy.x + enemy.width &&
              player.x + player.width > enemy.x &&
              player.y < enemy.y + enemy.height &&
              player.y + player.height > enemy.y) {
            alert('ゲームオーバー！');
            location.reload();
          }
        });

requestAnimationFrame(update);
      };

const handleTouchMove = (event) => {
        const touchX = event.touches[0].clientX;
        const touchY = event.touches[0].clientY;

// プレイヤーの移動
        if (touchX < player.x + player.width / 2) {
          player.x -= playerSpeed;
        } else {
          player.x += playerSpeed;
        }
        if (touchY < player.y + player.height / 2) {
          player.y -= playerSpeed;
        } else {
          player.y += playerSpeed;
        }

event.preventDefault();
      };

canvas.addEventListener('touchmove', handleTouchMove, { passive: false });

update();
    });
  </script>
</body>
</html>
```

（注：FPSゲームに必要な機能の全てを実装するにはもう少し複雑な処理が必要ですが、上記のコードは基本的な機能を実装したシンプルなゲームとなっています。）