Crie um jogo onde se você clica na tela vai aperaça um quadrado azul e vermelho e quando eles se tocam e gerado um verde's game

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

No:35974

←

Prev Next

→

Crie um jogo onde se você clica na tela vai aperaç..ALL
Developer User16419｜Date and time 24/1/16 5:38:19
Build time 12.777 sec｜Game capacity 3.407KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Jogo de Quadrados</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
        
        canvas {
            background-color: #000;
            display: block;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>

// Definir o tamanho do canvas como o tamanho da janela
        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;

// Array para armazenar os quadrados
        var squares = [];

// Função para criar um novo quadrado
        function createSquare(x, y, color) {
            var square = {
                x: x,
                y: y,
                width: 50,
                height: 50,
                color: color
            };

squares.push(square);
        }

// Função para verificar a colisão entre dois quadrados
        function checkCollision(square1, square2) {
            if (square1.x < square2.x + square2.width &&
                square1.x + square1.width > square2.x &&
                square1.y < square2.y + square2.height &&
                square1.y + square1.height > square2.y) {
                return true;
            }

return false;
        }

// Função para atualizar o jogo
        function update() {
            // Limpar o canvas
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Criar um quadrado vermelho na posição do toque/click
            canvas.addEventListener("touchstart", function(event) {
                event.preventDefault();

var touchX = event.touches[0].pageX;
                var touchY = event.touches[0].pageY;
                createSquare(touchX, touchY, "red");
            });

// Criar um quadrado azul na posição do toque/click
            canvas.addEventListener("mousedown", function(event) {
                var mouseX = event.clientX;
                var mouseY = event.clientY;
                createSquare(mouseX, mouseY, "blue");
            });

// Atualizar e desenhar os quadrados
            squares.forEach(function(square) {
                square.y += 1; // Movimento descendente

ctx.fillStyle = square.color;
                ctx.fillRect(square.x, square.y, square.width, square.height);
            });

// Verificar as colisões entre os quadrados
            for (var i = 0; i < squares.length - 1; i++) {
                for (var j = i + 1; j < squares.length; j++) {
                    if (checkCollision(squares[i], squares[j])) {
                        // Criar um quadrado verde na posição da colisão
                        createSquare(squares[i].x, squares[i].y, "green");

// Remover os quadrados vermelho e azul que colidiram
                        squares.splice(i, 1);
                        squares.splice(j - 1, 1);
                    }
                }
            }

// Chamar a função update a cada frame
            requestAnimationFrame(update);
        }

// Iniciar o jogo
        update();
    </script>
</body>
</html>