A game that you are a circle and use your finger on the circle and try not to collide with bricks's game

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

No:11976

118

←

Prev Next

→

A game that you are a circle and use your finger o..ALL
Developer User4131｜Date and time 23/8/13 7:06:04
Build time 20.99 sec｜Game capacity 2.986KB｜

Script

Sure! Here's an example of a simple game where you control a circle using touch input on a smartphone. The goal is to avoid colliding with the bricks.

To play the game, you can copy the above code into a single HTML file and open it on a smartphone. The game will start automatically, and you can control the circle by dragging your finger on the screen. Avoid collision with the bricks, as colliding with them will display "Game Over" in red text on the screen.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

Sure! Here's an example of a simple game where you control a circle using touch input on a smartphone. The goal is to avoid colliding with the bricks.

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

// Initialize the game
    function init() {
      canvas = document.getElementById('gameCanvas');
      context = canvas.getContext('2d');

circle = {
        x: canvas.width / 2,
        y: canvas.height / 2,
        radius: 20
      };

// Generate initial bricks
      generateBricks();

// Bind touch events
      canvas.addEventListener('touchmove', handleMove);

// Start game loop
      gameLoop = setInterval(update, 10);
    }

// Generate random bricks
    function generateBricks() {
      bricks = [];
      for (var i = 0; i < 5; i++) {
        var brick = {
          x: Math.random() * (canvas.width - 50),
          y: Math.random() * (canvas.height - 50),
          width: 50,
          height: 50
        };
        bricks.push(brick);
      }
    }

// Handle touchmove event
    function handleMove(event) {
      // Get touch position relative to canvas
      var touch = event.touches[0];
      var touchX = touch.clientX - canvas.offsetLeft;
      var touchY = touch.clientY - canvas.offsetTop;

// Update circle position
      circle.x = touchX;
      circle.y = touchY;
    }

// Update game logic
    function update() {
      // Clear canvas
      context.clearRect(0, 0, canvas.width, canvas.height);

// Draw circle
      context.beginPath();
      context.arc(circle.x, circle.y, circle.radius, 0, 2 * Math.PI, false);
      context.fillStyle = '#000';
      context.fill();
      context.closePath();

// Draw bricks
      bricks.forEach(function(brick) {
        context.fillStyle = '#999';
        context.fillRect(brick.x, brick.y, brick.width, brick.height);

// Check collision with bricks
        if (circle.x < brick.x + brick.width &&
          circle.x + 2 * circle.radius > brick.x &&
          circle.y < brick.y + brick.height &&
          circle.y + 2 * circle.radius > brick.y) {
          // Collision occurred, game over
          clearInterval(gameLoop);
          context.font = '30px Arial';
          context.fillStyle = 'red';
          context.fillText('Game Over', canvas.width / 2 - 75, canvas.height / 2);
        }
      });
    }

// Start the game
    init();
  </script>
</body>
</html>
```