AI game creator

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

No:27541

←

Prev Next

→

バウンド
Developer User13706｜Date and time 23/12/7 18:27:03
Build time 70.368 sec｜Game capacity 3.387KB｜

Script

了解しました。以下にゲームのプログラムを示します。

このゲームは、キャンバス上でボールとパドルがバウンドするシンプルなゲームです。スマホでも遊べるように画面サイズを調整しています。JavaScriptでボールとパドルの移動や衝突判定を行っています。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下にゲームのプログラムを示します。

```html
<!DOCTYPE html>
<html>
<head>
  <title>バウンドゲーム</title>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="600"></canvas>
  <script>
    // ゲームオブジェクトの定義
    const game = {
      canvas: document.getElementById("gameCanvas"),
      context: null,
      ball: {
        x: 200,
        y: 200,
        radius: 20,
        speedX: 5,
        speedY: 5,
      },
      paddle: {
        x: 180,
        y: 550,
        width: 40,
        height: 10,
        speed: 10,
        leftPressed: false,
        rightPressed: false,
      }
    };

// ゲームの準備
    function setupGame() {
      game.context = game.canvas.getContext("2d");

document.addEventListener("keydown", keyDownHandler);
      document.addEventListener("keyup", keyUpHandler);

setInterval(moveObjects, 10);
      setInterval(drawObjects, 10);
    }

// キーボードのイベント処理
    function keyDownHandler(e) {
      if (e.key === "Left" || e.key === "ArrowLeft") {
        game.paddle.leftPressed = true;
      } else if (e.key === "Right" || e.key === "ArrowRight") {
        game.paddle.rightPressed = true;
      }
    }

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

// オブジェクトの移動と画面の更新
    function moveObjects() {
      const ball = game.ball;
      const paddle = game.paddle;

ball.x += ball.speedX;
      ball.y += ball.speedY;
      
      if (ball.x + ball.radius >= game.canvas.width || ball.x - ball.radius <= 0) {
        ball.speedX = -ball.speedX;
      }
      
      if (ball.y + ball.radius >= game.canvas.height || ball.y - ball.radius <= 0) {
        ball.speedY = -ball.speedY;
      }
      
      if (paddle.leftPressed && paddle.x > 0) {
        paddle.x -= paddle.speed;
      }
      
      if (paddle.rightPressed && paddle.x + paddle.width < game.canvas.width) {
        paddle.x += paddle.speed;
      }
      
      if (
        ball.x + ball.radius > paddle.x &&
        ball.x - ball.radius < paddle.x + paddle.width &&
        ball.y + ball.radius > paddle.y &&
        ball.y - ball.radius < paddle.y + paddle.height
      ) {
        ball.speedY = -ball.speedY;
      }
    }

function drawObjects() {
      const context = game.context;
      const ball = game.ball;
      const paddle = game.paddle;

context.clearRect(0, 0, game.canvas.width, game.canvas.height);

context.beginPath();
      context.arc(ball.x, ball.y, ball.radius, 0, Math.PI * 2, false);
      context.fillStyle = "black";
      context.fill();
      context.closePath();

context.beginPath();
      context.rect(paddle.x, paddle.y, paddle.width, paddle.height);
      context.fillStyle = "black";
      context.fill();
      context.closePath();
    }

setupGame();
  </script>
</body>
</html>
```