AI game creator

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

No:37903

←

Prev Next

→

Flappy bird
Developer User17148｜Date and time 24/1/21 19:46:17
Build time 13.937 sec｜Game capacity 3.073KB｜

Script

Bien sûr ! Voici une version simplifiée du jeu Flappy Bird que vous pouvez jouer sur votre smartphone en utilisant des pictogrammes. Voici le code HTML :

Ce code utilise un canvas pour afficher les éléments du jeu (oiseau, tuyaux, score). L'oiseau est contrôlé en touchant l'écran ou en cliquant avec la souris. Le jeu se termine lorsque l'oiseau entre en collision avec les tuyaux. Assurez-vous d'avoir les images `emozi_all/bird.png`, `emozi_chicken.png`, et `emozi_rabbit.png` dans le même répertoire que votre fichier HTML pour que le jeu fonctionne correctement.

←

Prev　Next

→ 　

Back　

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

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

Bien sûr ! Voici une version simplifiée du jeu Flappy Bird que vous pouvez jouer sur votre smartphone en utilisant des pictogrammes. Voici le code HTML :

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

// Initialisation du canvas
    const canvas = document.getElementById("gameCanvas");
    const ctx = canvas.getContext("2d");

// Variables du jeu
    let birdX = 50;
    let birdY = canvas.height / 2;
    let gravity = 1;
    let velocity = 0;
    let gap = 200;
    let score = 0;

// Chargement des images
    const birdImg = new Image();
    birdImg.src = "bird.png";

const pipeNorthImg = new Image();
    pipeNorthImg.src = "pipeNorth.png";

const pipeSouthImg = new Image();
    pipeSouthImg.src = "pipeSouth.png";

// Fonction de dessin du canvas
    function draw() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);

// Dessin du bird
      ctx.drawImage(birdImg, birdX, birdY, 50, 50);

// Mise à jour de la position du bird
      velocity += gravity;
      birdY += velocity;

// Dessin des tuyaux
      let pipeX = canvas.width;
      let pipeY = canvas.height - gap;
      ctx.drawImage(pipeNorthImg, pipeX, pipeY, 80, 400);
      ctx.drawImage(pipeSouthImg, pipeX, 0, 80, canvas.height - gap - 200);

// Mise à jour de la position des tuyaux
      pipeX -= 2;
      
      // Vérification des collisions
      if (
        birdX + 50 >= pipeX && 
        birdX <= pipeX + 80 && (
          birdY <= pipeY ||
          birdY + 50 >= pipeY + gap)
      ) {
        // Collisions détectées, le jeu est perdu
        gameOver();
      }

// Mise à jour du score
      if (pipeX === birdX) {
        score++;
      }

// Affichage du score
      ctx.fillStyle = "#000";
      ctx.font = "30px Arial";
      ctx.fillText("Score: " + score, 10, 50);

// Appel de la fonction de dessin à chaque rafraîchissement de l'écran
      requestAnimationFrame(draw);
    }

// Fonction de gestion des touchés sur l'écran
    function handleTouch(e) {
      if (birdY > 50) {
        velocity = -10;
      }
    }

// Fonction de fin de jeu
    function gameOver() {
      // Arrêter le jeu, afficher l'écran de fin, etc.
    }

// Démarrage du jeu
    document.addEventListener("DOMContentLoaded", function(event) {
      draw();
      document.addEventListener("touchstart", handleTouch);
      document.addEventListener("mousedown", handleTouch);
    });
  </script>
</body>
</html>
```

Assurez-vous d'avoir les images `bird.png`, `pipeNorth.png`, et `pipeSouth.png` dans le même répertoire que votre fichier HTML pour que le jeu fonctionne correctement.