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

No:7085

383

←

Prev Next

→

Independent indie game creator
Developer User3964｜Date and time 23/7/5 12:38:18
Build time 17.373 sec｜Game capacity 2.433KB｜

Script

了解しました。以下に、スマホで遊べるシンプルなゲームの実装例を示します。

スマホゲーム

スコア: 0

このゲームは、画面上の円（プレイヤー）をスマホのタッチ操作で移動させます。円が動くことによって得点が加算され、画面上にスコアが表示されます。プレイヤーが画面外に出ないようにするなど、ゲーム性を追加することも可能ですが、ここでは簡単な実装例として提示しました。

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

了解しました。以下に、スマホで遊べるシンプルなゲームの実装例を示します。

```html
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>スマホゲーム</title>
</head>
<body>
  <h1>スマホゲーム</h1>
  <p id="score">スコア: 0</p>

// プレイヤーの初期位置
    const player = {
      x: canvas.width / 2,
      y: canvas.height - 30,
      radius: 10,
      speed: 5
    };

let score = 0;

// タッチイベントを取得
    canvas.addEventListener("touchstart", handleTouchStart, false);
    canvas.addEventListener("touchmove", handleTouchMove, false);

let touchStartX = 0;
    let touchStartY = 0;

function handleTouchStart(event) {
      touchStartX = event.touches[0].clientX;
      touchStartY = event.touches[0].clientY;
    }

function handleTouchMove(event) {
      event.preventDefault();
      const touchX = event.touches[0].clientX;
      const touchY = event.touches[0].clientY;

const deltaX = touchX - touchStartX;
      const deltaY = touchY - touchStartY;

player.x += deltaX;
      player.y += deltaY;

touchStartX = touchX;
      touchStartY = touchY;
    }

// 絵文字を表示する関数
    function drawPlayer() {
      ctx.beginPath();
      ctx.arc(player.x, player.y, player.radius, 0, Math.PI * 2);
      ctx.fillStyle = "yellow";
      ctx.fill();
      ctx.closePath();
    }

// ゲームループ
    function drawGame() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      drawPlayer();

// スコア表示
      ctx.font = "16px Arial";
      ctx.fillStyle = "black";
      ctx.fillText("スコア: " + score, 8, 20);

requestAnimationFrame(drawGame);
    }

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