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

No:9040

170

soaring kite
Developer User4271｜Date and time 23/7/20 21:23:28
Build time 29.281 sec｜Game capacity 2.905KB｜

は、以下の通りです。

空飛ぶ鳶

操作方法:

スマートフォンの画面をタップして、鳶を上に飛ばしましょう。

このプログラムは、HTMLの`canvas`要素を使用して、空飛ぶ鳶のゲームを作成しています。ゲームはスマートフォンの画面をタップすることで、鳶を上に飛ばすことができます。鳶は画面上を下に移動していき、画面の下端に到達するとゲームオーバーになります。鳶の位置や速度は変数`x`、`y`、`speed`で管理されており、タップイベントに応じて`flyUp()`関数が呼ばれ、`y`の値が上方向に変化します。`gameLoop()`関数はゲームループを実行し、鳶の位置を更新して描画します。`gameOver()`関数はゲームオーバー時に実行され、画面に「ゲームオーバー」と表示されます。以上で、「空飛ぶ鳶」というゲームが実装されたHTMLファイルの例を示しました。必要な場合は、CSSを使用してスタイリングを追加することも可能です。

→ 　

0　

0　

[PR]現在の欲しいゲームランキング

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

(C)2023 HisashiApp

は、以下の通りです。

```html
<!DOCTYPE html>
<html>
<head>
    <title>空飛ぶ鳶</title>
</head>
<body>
    <h1>空飛ぶ鳶</h1>
    <h3>操作方法:</h3>
    <p>スマートフォンの画面をタップして、鳶を上に飛ばしましょう。</p>
    
    <canvas id="gameCanvas" width="400" height="600"></canvas>
    
    <script>
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");

// スマートフォンのタップイベントをリスンする
        canvas.addEventListener("touchstart", function(event) {
            flyUp();
        });

// 鳶の初期位置
        let x = 200;
        let y = 300;

// 鳶の速度
        let speed = 2;

// 鳶を上に飛ばす関数
        function flyUp() {
            y -= 40;
        }

// ゲームループ
        function gameLoop() {
            // 画面をクリア
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// 鳶を描画
            drawBird(x, y);

// 鳶を下に落とす
            y += speed;

// ゲームオーバーチェック
            if (y + 40 > canvas.height) {
                gameOver();
                return;
            }

// 次のフレームの更新処理
            requestAnimationFrame(gameLoop);
        }

// 鳶を描画する関数
        function drawBird(x, y) {
            ctx.beginPath();
            ctx.arc(x, y, 20, 0, 2 * Math.PI);
            ctx.fillStyle = "orange";
            ctx.fill();
            ctx.closePath();
        }

// ゲームオーバー時の処理
        function gameOver() {
            ctx.font = "48px Arial";
            ctx.fillStyle = "red";
            ctx.fillText("ゲームオーバー", 80, 300);
        }

// ゲーム開始
        gameLoop();
    </script>
</body>
</html>
```

このプログラムは、HTMLの`canvas`要素を使用して、空飛ぶ鳶のゲームを作成しています。ゲームはスマートフォンの画面をタップすることで、鳶を上に飛ばすことができます。鳶は画面上を下に移動していき、画面の下端に到達するとゲームオーバーになります。

鳶の位置や速度は変数`x`、`y`、`speed`で管理されており、タップイベントに応じて`flyUp()`関数が呼ばれ、`y`の値が上方向に変化します。`gameLoop()`関数はゲームループを実行し、鳶の位置を更新して描画します。`gameOver()`関数はゲームオーバー時に実行され、画面に「ゲームオーバー」と表示されます。

以上で、「空飛ぶ鳶」というゲームが実装されたHTMLファイルの例を示しました。必要な場合は、CSSを使用してスタイリングを追加することも可能です。