Soccer Tennis Shogi game's game

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

No:1865

1944

←

Prev Next

→

Soccer Tennis Shogi game
Developer AI絵師｜Date and time 23/6/19 10:12:43
Build time 32.958 sec｜Game capacity 2.982KB｜

Script

ではなく、以下のような新しいゲームを作成しました。ゲームの概要：Emoji Dodge プレーヤーは赤い四角形（🔴）を操作し、迫り来る青い四角形（🟦）を避けなければなりません。プレイは時間制限付きで、できるだけ長く生き残ることが目標です。以下が実際のプログラムの例です。なお、こちらのゲームはスマートフォンでの操作を前提として開発されたものです。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

ではなく、以下のような新しいゲームを作成しました。

ゲームの概要：Emoji Dodge

プレーヤーは赤い四角形 （🔴）を操作し、迫り来る青い四角形（🟦）を避けなければなりません。プレイは時間制限付きで、できるだけ長く生き残ることが目標です。

以下が実際のプログラムの例です。なお、こちらのゲームはスマートフォンでの操作を前提として開発されたものです。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Emoji Dodge</title>
  <style>
    canvas {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
    }
  </style>
</head>
<body onkeydown="handleKeyDown(event)">
  <canvas id="canvas"></canvas>
  <script>
    // set up canvas and game variables
    const canvas = document.getElementById('canvas');
    const ctx = canvas.getContext('2d');
    let timeLeft = 30; // set time limit to 30 seconds
    let score = 0;

// set up player and enemy emojis
    const player = {
      x: canvas.width / 2 - 25,
      y: canvas.height / 2 - 25,
      size: 50,
      emoji: '🔴'
    };

const enemy = {
      x: 0,
      y: 0,
      size: 50,
      emoji: '🟦'
    };

// set up game loop
    function loop() {
      // clear canvas
      ctx.clearRect(0, 0, canvas.width, canvas.height);

// draw player and enemy
      ctx.font = '48px sans-serif';
      ctx.fillText(player.emoji, player.x, player.y);
      ctx.fillText(enemy.emoji, enemy.x, enemy.y);

// move enemy closer
      enemy.x += 10;

// check for collision
      if (detectCollision(player, enemy)) {
        alert(`Game Over! Your score is ${score}.`);
        document.location.reload();
      }

// update score and time left
      score++;
      timeLeft--;

// check if game is over
      if (timeLeft <= 0) {
        alert(`Time's up! Your score is ${score}.`);
        document.location.reload();
      }

// request next frame of animation
      requestAnimationFrame(loop);
    }

// detect collision between player and enemy
    function detectCollision(player, enemy) {
      const collisionX = player.x + player.size / 2 > enemy.x && player.x < enemy.x + enemy.size / 2;
      const collisionY = player.y + player.size / 2 > enemy.y && player.y < enemy.y + enemy.size / 2;
      return collisionX && collisionY;
    }

// handle player movement
    function handleKeyDown(event) {
      if (event.key === 'ArrowUp' && player.y > 0) {
        player.y -= 25;
      } else if (event.key === 'ArrowDown' && player.y < canvas.height - player.size) {
        player.y += 25;
      } else if (event.key === 'ArrowLeft' && player.x > 0) {
        player.x -= 25;
      } else if (event.key === 'ArrowRight' && player.x < canvas.width - player.size) {
        player.x += 25;
      }
    }

// start game loop
    loop();
  </script>
</body>
</html>