Flappy bird,But game with smooth graphics's game

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

No:36869

←

Prev Next

→

Flappy bird,But game with smooth graphics
Developer User16891｜Date and time 24/1/19 1:03:28
Build time 19.677 sec｜Game capacity 3.971KB｜

Script

Sure! Here's an example implementation of a simplified version of Flappy Bird using HTML and JavaScript:

This code creates a simple Flappy Bird game with smooth graphics using HTML canvas and JavaScript. The game can be played on a smartphone by running the HTML file within a web browser. The game starts automatically and the player controls the bird's flight by tapping the screen. The goal is to navigate the bird through the gaps between the pipes without colliding. The score increases for each successfully passed pipe, and the game ends if the bird collides with a pipe or the ground.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example implementation of a simplified version of Flappy Bird using HTML and JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    canvas {
      border: 1px solid #000;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>

// Bird object
    var Bird = function(x, y) {
      this.x = x || 50;
      this.y = y || 200;
      this.velocityY = 0;
      this.gravity = 0.5;
      this.flapStrength = 10;
      this.width = 30;
      this.height = 30;
    };

Bird.prototype.draw = function() {
      ctx.fillStyle = "#F00"; // Red color
      ctx.fillRect(this.x, this.y, this.width, this.height);
    };

Bird.prototype.update = function() {
      this.velocityY += this.gravity;
      this.y += this.velocityY;
    };

Bird.prototype.flap = function() {
      this.velocityY -= this.flapStrength;
    };

// Pipe object
    var Pipe = function(x, y) {
      this.x = x || canvas.width;
      this.y = y || 0;
      this.width = 50;
      this.height = Math.random() * (canvas.height - 100) + 50;
      this.speedX = 2;
    };

Pipe.prototype.draw = function() {
      ctx.fillStyle = "#080"; // Green color
      ctx.fillRect(this.x, this.y, this.width, this.height);
    };

Pipe.prototype.update = function() {
      this.x -= this.speedX;
    };

// Game initialization
    function init() {
      canvas = document.getElementById("gameCanvas");
      ctx = canvas.getContext("2d");

bird = new Bird();
      pipes = [];
      score = 0;

gameInterval = setInterval(updateGame, 1000/60);

document.addEventListener("keydown", function(e) {
        if (e.keyCode === 32) { // Spacebar
          bird.flap();
        }
      });
    }

// Game update function
    function updateGame() {
      clearCanvas();
      bird.update();
      bird.draw();

if (pipes.length === 0 || pipes[pipes.length - 1].x < canvas.width - 150) {
        generatePipe();
      }

for (var i = 0; i < pipes.length; i++) {
        pipes[i].update();
        pipes[i].draw();

if (checkCollision(bird, pipes[i])) {
          endGame();
          return;
        }

if (pipes[i].x + pipes[i].width < 0) {
          pipes.splice(i, 1);
          i--;
          score++;
        }
      }

drawScore();
    }

// Generate new pipe
    function generatePipe() {
      var gapPosition = Math.random() * (canvas.height - 200) + 100;
      pipes.push(new Pipe(canvas.width, 0));
      pipes.push(new Pipe(canvas.width, gapPosition + 100));
    }

// Check collision between bird and pipe
    function checkCollision(bird, pipe) {
      if (bird.x < pipe.x + pipe.width &&
          bird.x + bird.width > pipe.x &&
          bird.y < pipe.y + pipe.height &&
          bird.y + bird.height > pipe.y) {
        return true;
      }
      return false;
    }

// Draw current score
    function drawScore() {
      ctx.fillStyle = "#000";
      ctx.font = "20px Arial";
      ctx.fillText("Score: " + score, 10, 30);
    }

// Clear canvas
    function clearCanvas() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
    }

// End the game
    function endGame() {
      clearInterval(gameInterval);
      alert("Game Over! Your score: " + score);
    }

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