tank shooting bullets and a mech shooting a ton of rocks's game

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

No:10215

178

←

Prev Next

→

tank shooting bullets and a mech shooting a ton of..ALL
Developer User4498｜Date and time 23/7/29 12:36:10
Build time 33.675 sec｜Game capacity 5.106KB｜

Script

Sure! Here's a simple game that meets your requirements. It's a tank shooting bullets while a mech shoots rocks. The game will be played on a smartphone using pictograms.

To play the game, simply paste the HTML code into a new HTML file, open it in a web browser, and interact with the game using the left and right arrow keys to move the tank and the spacebar to shoot bullets. The tank shoots black bullets, and the mech shoots blue rocks. The game keeps track of your score, which increases every time you hit a rock with a bullet. Please note that this is a basic implementation just for demonstration purposes. You can further enhance it by adding more features, levels, and improved graphics as per your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

Sure! Here's a simple game that meets your requirements. It's a tank shooting bullets while a mech shoots rocks. The game will be played on a smartphone using pictograms.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Tank vs Mech Game</title>
  <style>
    canvas {
      border: 1px solid black;
      display: block;
      margin: 0 auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>

// Tank object
    function Tank(x, y, width, height, color) {
      this.x = x;
      this.y = y;
      this.width = width;
      this.height = height;
      this.color = color;

this.draw = function() {
        ctx.fillStyle = this.color;
        ctx.fillRect(this.x, this.y, this.width, this.height);
      }
    }

// Mech object
    function Mech(x, y, width, height, color) {
      this.x = x;
      this.y = y;
      this.width = width;
      this.height = height;
      this.color = color;

this.draw = function() {
        ctx.fillStyle = this.color;
        ctx.fillRect(this.x, this.y, this.width, this.height);
      }
    }

// Bullet object
    function Bullet(x, y, radius, color) {
      this.x = x;
      this.y = y;
      this.radius = radius;
      this.color = color;

this.draw = function() {
        ctx.beginPath();
        ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2);
        ctx.fillStyle = this.color;
        ctx.fill();
        ctx.closePath();
      }

this.update = function() {
        this.y -= bulletSpeed;
        this.draw();
      }
    }

// Rock object
    function Rock(x, y, width, height, color) {
      this.x = x;
      this.y = y;
      this.width = width;
      this.height = height;
      this.color = color;

this.draw = function() {
        ctx.fillStyle = this.color;
        ctx.fillRect(this.x, this.y, this.width, this.height);
      }

this.update = function() {
        this.y += rockSpeed;
        this.draw();
      }
    }

// Initialize the game
    function init() {
      canvas = document.getElementById("gameCanvas");
      ctx = canvas.getContext("2d");

// Create tank
      tank = new Tank(180, 350, 40, 40, "red");

// Create mech
      mech = new Mech(180, 20, 60, 60, "blue");

// Create arrays to store bullets and rocks
      bullets = [];
      rocks = [];

// Event listeners for tank movement and shooting
      document.addEventListener("keydown", handleKeyDown);
      document.addEventListener("keyup", handleKeyUp);

// Start the game loop
      setInterval(update, 20);
    }

// Event handlers for tank movement
    function handleKeyDown(event) {
      if (event.key === "ArrowLeft") {
        tank.x -= 5;
      } else if (event.key === "ArrowRight") {
        tank.x += 5;
      } else if (event.key === " ") {
        shootBullet();
      }
    }

function handleKeyUp(event) {
      if (event.key === "ArrowLeft" || event.key === "ArrowRight") {
        tank.x = tank.x;
      }
    }

function shootBullet() {
      var bullet = new Bullet(tank.x + tank.width / 2, tank.y, 5, "black");
      bullets.push(bullet);
    }

// Update game state
    function update() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);

tank.draw();
      mech.draw();

// Update and draw bullets
      for (var i = 0; i < bullets.length; i++) {
        bullets[i].update();
        if (bullets[i].y < 0) {
          bullets.splice(i, 1);
          i--;
        }
      }

// Update and draw rocks
      for (var j = 0; j < rocks.length; j++) {
        rocks[j].update();
        if (rocks[j].y > canvas.height) {
          rocks.splice(j, 1);
          j--;
        }
      }

// Check for bullet-rock collision
      for (var k = 0; k < bullets.length; k++) {
        for (var l = 0; l < rocks.length; l++) {
          if (
            bullets[k].x + bullets[k].radius > rocks[l].x &&
            bullets[k].x < rocks[l].x + rocks[l].width &&
            bullets[k].y + bullets[k].radius > rocks[l].y &&
            bullets[k].y < rocks[l].y + rocks[l].height
          ) {
            score++;
            rocks.splice(l, 1);
            l--;
          }
        }
      }

ctx.font = "16px Arial";
      ctx.fillStyle = "black";
      ctx.fillText("Score: " + score, 8, 20);
    }

// Start the game
    init();
  </script>
</body>
</html>
```

Please note that this is a basic implementation just for demonstration purposes. You can further enhance it by adding more features, levels, and improved graphics as per your requirements.