AI game creator

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

No:13056

←

Prev Next

→

射击游戏
Developer User5761｜Date and time 23/8/26 16:49:16
Build time 23.069 sec｜Game capacity 3.308KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>射击游戏</title>
  <style>
    canvas {
      border: 1px solid #000;
      display: block;
      margin: 0 auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>
  <script>
    // 获取画布
    var canvas = document.getElementById("gameCanvas");
    var ctx = canvas.getContext("2d");

// 定义玩家
    var player = {
      x: canvas.width / 2,
      y: canvas.height - 30,
      width: 30,
      height: 30,
      color: "#0095DD"
    };

// 定义子弹
    var bullet = {
      x: player.x,
      y: player.y,
      speed: 3,
      width: 5,
      height: 15,
      color: "#0095DD"
    };

// 定义敌人
    var enemy = {
      x: Math.random() * (canvas.width - 20),
      y: 0,
      speed: 2,
      width: 20,
      height: 20,
      color: "#FF0000"
    };

// 监听移动操作
    document.addEventListener("keydown", keyDownHandler, false);
    document.addEventListener("keyup", keyUpHandler, false);

var rightPressed = false;
    var leftPressed = false;

function keyDownHandler(e) {
      if(e.key == "Right" || e.key == "ArrowRight") {
        rightPressed = true;
      }
      if(e.key == "Left" || e.key == "ArrowLeft") {
        leftPressed = true;
      }
    }

function keyUpHandler(e) {
      if(e.key == "Right" || e.key == "ArrowRight") {
        rightPressed = false;
      }
      if(e.key == "Left" || e.key == "ArrowLeft") {
        leftPressed = false;
      }
    }

// 绘制玩家
    function drawPlayer() {
      ctx.beginPath();
      ctx.rect(player.x, player.y, player.width, player.height);
      ctx.fillStyle = player.color;
      ctx.fill();
      ctx.closePath();
    }

// 绘制子弹
    function drawBullet() {
      ctx.beginPath();
      ctx.rect(bullet.x, bullet.y, bullet.width, bullet.height);
      ctx.fillStyle = bullet.color;
      ctx.fill();
      ctx.closePath();
    }

// 绘制敌人
    function drawEnemy() {
      ctx.beginPath();
      ctx.rect(enemy.x, enemy.y, enemy.width, enemy.height);
      ctx.fillStyle = enemy.color;
      ctx.fill();
      ctx.closePath();
    }

// 碰撞检测
    function collisionDetection() {
      if(bullet.x > enemy.x && bullet.x < enemy.x + enemy.width && bullet.y > enemy.y && bullet.y < enemy.y + enemy.height) {
        return true;
      }
      return false;
    }

// 主循环
    function draw() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();
      drawBullet();
      drawEnemy();

if(collisionDetection()) {
        alert("游戏胜利！");
        document.location.reload();
      }

if(rightPressed && player.x < canvas.width - player.width) {
        player.x += 7;
        bullet.x += 7;
      }
      else if(leftPressed && player.x > 0) {
        player.x -= 7;
        bullet.x -= 7;
      }

if(bullet.y > 0) {
        bullet.y -= bullet.speed;
      }
      else {
        bullet.y = player.y;
        bullet.x = player.x;
      }

if(enemy.y < canvas.height) {
        enemy.y += enemy.speed;
      }
      else {
        enemy.x = Math.random() * (canvas.width - 20);
        enemy.y = 0;
      }

requestAnimationFrame(draw);
    }

draw();
  </script>
</body>
</html>