AI game creator

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

No:12003

119

←

Prev Next

→

Flappy bird
Developer User5017｜Date and time 23/8/13 12:13:05
Build time 25.621 sec｜Game capacity 4.523KB｜

Script

Claro, puedo ayudarte a crear un juego estilo Flappy Bird usando JavaScript en un único archivo HTML. Aquí tienes un ejemplo:

Este código crea un juego básico de Flappy Bird utilizando un canvas en HTML y JavaScript para el dibujo y la lógica del juego. El jugador controla el pájaro haciendo clic en la pantalla para hacerlo saltar y debe evitar chocar con los obstáculos mientras intenta obtener la mayor puntuación posible. Cuando se produce una colisión, se muestra un mensaje de juego perdido y se reinicia el juego al recargar la página. Espero que esto te sea útil para empezar. ¡Diviértete jugando!

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

Claro, puedo ayudarte a crear un juego estilo Flappy Bird usando JavaScript en un único archivo HTML. Aquí tienes un ejemplo:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Flappy Bird</title>
    <style>
        canvas {
            border: 1px solid black;
            background-color: skyblue;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>

// Definir el pájaro
        var bird = {
            x: 50,
            y: canvas.height / 2,
            width: 50,
            height: 50,
            speed: 2,
            gravity: 0.1,
            jumpHeight: -4
        };

// Definir los obstáculos
        var obstacles = [];
        var obstacleWidth = 80;
        var gapSize = 150;
        var minObstacleHeight = 50;
        var maxObstacleHeight = canvas.height - minObstacleHeight - gapSize;

// Variable para llevar la puntuación
        var score = 0;

// Manejador de eventos para saltar
        canvas.addEventListener('click', function () {
            bird.y += bird.jumpHeight;
        });

// Función para dibujar el pájaro y los obstáculos
        function draw() {
            // Limpiar el canvas
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Dibujar el pájaro
            ctx.fillStyle = 'yellow';
            ctx.fillRect(bird.x, bird.y, bird.width, bird.height);

// Dibujar los obstáculos
            ctx.fillStyle = 'green';
            for (var i = 0; i < obstacles.length; i++) {
                ctx.fillRect(obstacles[i].x, obstacles[i].y, obstacleWidth, obstacles[i].height);
            }

// Dibujar la puntuación
            ctx.fillStyle = 'black';
            ctx.font = '20px Arial';
            ctx.fillText('Puntuación: ' + score, 10, 30);
        }

// Función para mover el pájaro y los obstáculos
        function update() {
            // Mover el pájaro
            bird.y += bird.speed;
            bird.speed += bird.gravity;

// Crear nuevos obstáculos
            if (obstacles.length === 0 || obstacles[obstacles.length - 1].x < canvas.width - obstacleWidth * 3) {
                var obstacleHeight = Math.floor(Math.random() * (maxObstacleHeight - minObstacleHeight + 1)) + minObstacleHeight;
                obstacles.push({
                    x: canvas.width,
                    y: -obstacleHeight,
                    height: obstacleHeight
                });
            }

// Mover los obstáculos
            for (var i = 0; i < obstacles.length; i++) {
                obstacles[i].x -= bird.speed;

// Comprobar colisiones con el pájaro
                if (bird.x < obstacles[i].x + obstacleWidth &&
                    bird.x + bird.width > obstacles[i].x &&
                    bird.y < obstacles[i].y + obstacles[i].height &&
                    bird.y + bird.height > obstacles[i].y) {
                    // Colisión detectada, fin del juego
                    clearInterval(gameLoop);
                    alert('¡Has perdido! Tu puntuación final es: ' + score);
                    location.reload();
                }

// Aumentar la puntuación cuando pasa un obstáculo
                if (obstacles[i].x + obstacleWidth < bird.x && !obstacles[i].scored) {
                    obstacles[i].scored = true;
                    score++;
                }

// Eliminar obstáculos fuera de la pantalla
                if (obstacles[i].x + obstacleWidth < 0) {
                    obstacles.splice(i, 1);
                    i--;
                }
            }
        }

// Bucle principal del juego
        var gameLoop = setInterval(function () {
            draw();
            update();
        }, 10);
    </script>
</body>
</html>
```

Espero que esto te sea útil para empezar. ¡Diviértete jugando!