AI game creator

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

No:37936

←

Prev Next

→

Flappy bird
Developer User17159｜Date and time 24/1/21 22:11:28
Build time 13.592 sec｜Game capacity 3.623KB｜

Script

Sure! Here's an example of a simplified implementation of the Flappy Bird game in a single HTML file using JavaScript:

In this implementation, the game can be played on a smartphone by tapping the screen instead of using the spacebar. The bird (represented by a yellow square) needs to avoid the green pipes by tapping to make the bird jump. If the bird collides with a pipe or hits the top or bottom of the canvas, the game restarts. Note that this is a simplified version of the Flappy Bird game and may not include all the features or complexities of the original game.

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

Sure! Here's an example of a simplified implementation of the Flappy Bird game in a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Flappy Bird</title>
    <style>
      canvas {
        border: 1px solid black;
        display: block;
        margin: 0 auto;
      }
    </style>
  </head>
  <body>
    <canvas id="canvas" width="400" height="600"></canvas>
    <script>
      // Game Variables
      var canvas = document.getElementById("canvas");
      var ctx = canvas.getContext("2d");
      var bird = { x: 50, y: 300, size: 20, speedY: 0, gravity: 0.5 };
      var pipes = [{ x: canvas.width, y: 0, width: 50, height: 200, speed: 2 }];

// Game Functions
      function drawBird() {
        ctx.fillStyle = "yellow";
        ctx.fillRect(bird.x, bird.y, bird.size, bird.size);
      }

function drawPipes() {
        pipes.forEach(function (pipe) {
          ctx.fillStyle = "green";
          ctx.fillRect(pipe.x, pipe.y, pipe.width, pipe.height);
        });
      }

function moveBird() {
        bird.y += bird.speedY;
        bird.speedY += bird.gravity;
      }

function movePipes() {
        pipes.forEach(function (pipe) {
          pipe.x -= pipe.speed;

if (pipe.x + pipe.width < 0) {
            // If the pipe goes off-screen, remove it from the array
            pipes.shift();
          }
        });

if (pipes[pipes.length - 1].x < canvas.width - 200) {
          // Generate a new pipe every 200px
          var pipeGap = 150;
          var minHeight = 50;
          var maxHeight = canvas.height - pipeGap - minHeight;

var randomHeight =
            Math.floor(Math.random() * (maxHeight - minHeight + 1)) + minHeight;

pipes.push({
            x: canvas.width,
            y: randomHeight,
            width: 50,
            height: canvas.height - randomHeight,
            speed: 2,
          });
        }
      }

function collisionDetection() {
        pipes.forEach(function (pipe) {
          if (
            bird.x < pipe.x + pipe.width &&
            bird.x + bird.size > pipe.x &&
            bird.y < pipe.y + pipe.height &&
            bird.y + bird.size > pipe.y
          ) {
            // Collision detected
            resetGame();
          }
        });

if (bird.y + bird.size > canvas.height || bird.y < 0) {
          // Bird hits the top or bottom of the canvas
          resetGame();
        }
      }

function resetGame() {
        bird.y = 300;
        bird.speedY = 0;
        pipes = [{ x: canvas.width, y: 0, width: 50, height: 200, speed: 2 }];
      }

function gameLoop() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);

drawBird();
        drawPipes();
        moveBird();
        movePipes();
        collisionDetection();

requestAnimationFrame(gameLoop);
      }

// Event Listeners
      document.addEventListener("keydown", function (event) {
        if (event.keyCode === 32) {
          bird.speedY = -9; // Jump when spacebar is pressed
        }
      });

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

Note that this is a simplified version of the Flappy Bird game and may not include all the features or complexities of the original game.