AI game creator

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

No:37251

←

Prev Next

→

Block Breaker
Developer User17046｜Date and time 24/1/20 22:52:25
Build time 20.509 sec｜Game capacity 5.945KB｜

Script

Sure! Here's a basic implementation of a Block Breaker game using HTML and JavaScript:

This code creates a simple block breaker game where the player controls a paddle to bounce a ball and break the bricks. The game is played using keyboard arrow keys to move the paddle left and right. The ball collides with the bricks and bounces back, destroying the bricks in the process. If the ball misses the paddle and touches the bottom wall, the game is over. The game is implemented using HTML canvas and JavaScript for the game logic. The code is enclosed within `
` tags and can be saved as a single HTML file to be played as a finished game. You can run the file on a web browser (preferably on a computer as the code is not optimized for smartphone operation) to play the game.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a basic implementation of a Block Breaker game using HTML and JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Block Breaker</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="300"></canvas>

// Paddle variables
        var paddleHeight = 10;
        var paddleWidth = 75;
        var paddleX = (canvas.width - paddleWidth) / 2;
        var rightPressed = false;
        var leftPressed = false;

// Brick variables
        var brickRowCount = 3;
        var brickColumnCount = 5;
        var brickWidth = 75;
        var brickHeight = 20;
        var brickPadding = 10;
        var brickOffsetTop = 30;
        var brickOffsetLeft = 30;

// Create the bricks
        var bricks = [];
        for (var c = 0; c < brickColumnCount; c++) {
            bricks[c] = [];
            for (var r = 0; r < brickRowCount; r++) {
                bricks[c][r] = { x: 0, y: 0, status: 1 };
            }
        }

// Event listeners for paddle movement
        document.addEventListener("keydown", keyDownHandler, false);
        document.addEventListener("keyup", keyUpHandler, false);

function keyDownHandler(e) {
            if (e.key == "Right" || e.key == "ArrowRight") {
                rightPressed = true;
            } else if (e.key == "Left" || e.key == "ArrowLeft") {
                leftPressed = true;
            }
        }

function keyUpHandler(e) {
            if (e.key == "Right" || e.key == "ArrowRight") {
                rightPressed = false;
            } else if (e.key == "Left" || e.key == "ArrowLeft") {
                leftPressed = false;
            }
        }

// Collision detection for bricks
        function collisionDetection() {
            for (var c = 0; c < brickColumnCount; c++) {
                for (var r = 0; r < brickRowCount; r++) {
                    var brick = bricks[c][r];
                    if (brick.status == 1) {
                        if (x > brick.x && x < brick.x + brickWidth && y > brick.y && y < brick.y + brickHeight) {
                            dy = -dy;
                            brick.status = 0;
                        }
                    }
                }
            }
        }

// Draw the ball
        function drawBall() {
            ctx.beginPath();
            ctx.arc(x, y, ballRadius, 0, Math.PI * 2);
            ctx.fillStyle = "#0095DD";
            ctx.fill();
            ctx.closePath();
        }

// Draw the paddle
        function drawPaddle() {
            ctx.beginPath();
            ctx.rect(paddleX, canvas.height - paddleHeight, paddleWidth, paddleHeight);
            ctx.fillStyle = "#0095DD";
            ctx.fill();
            ctx.closePath();
        }

// Draw the bricks
        function drawBricks() {
            for (var c = 0; c < brickColumnCount; c++) {
                for (var r = 0; r < brickRowCount; r++) {
                    if (bricks[c][r].status == 1) {
                        var brickX = (c * (brickWidth + brickPadding)) + brickOffsetLeft;
                        var brickY = (r * (brickHeight + brickPadding)) + brickOffsetTop;
                        bricks[c][r].x = brickX;
                        bricks[c][r].y = brickY;
                        ctx.beginPath();
                        ctx.rect(brickX, brickY, brickWidth, brickHeight);
                        ctx.fillStyle = "#0095DD";
                        ctx.fill();
                        ctx.closePath();
                    }
                }
            }
        }

// Game loop
        function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            drawBricks();
            drawBall();
            drawPaddle();
            collisionDetection();

// Move the paddle
            if (rightPressed && paddleX < canvas.width - paddleWidth) {
                paddleX += 7;
            } else if (leftPressed && paddleX > 0) {
                paddleX -= 7;
            }

// Move the ball
            x += dx;
            y += dy;

// Ball collision with walls
            if (x + dx > canvas.width - ballRadius || x + dx < ballRadius) {
                dx = -dx;
            }
            if (y + dy < ballRadius) {
                dy = -dy;
            } else if (y + dy > canvas.height - ballRadius) {
                if (x > paddleX && x < paddleX + paddleWidth) {
                    dy = -dy;
                } else {
                    // Game over
                    alert("GAME OVER");
                    document.location.reload();
                    clearInterval(interval);
                }
            }

requestAnimationFrame(draw);
        }

// Start the game
        var interval = setInterval(draw, 10);
    </script>
</body>
</html>
```

The game is implemented using HTML canvas and JavaScript for the game logic. The code is enclosed within `<script>` tags and can be saved as a single HTML file to be played as a finished game. You can run the file on a web browser (preferably on a computer as the code is not optimized for smartphone operation) to play the game.