flappy Random pictograms change with each tap's game

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

No:7978

7549

←

Prev Next

→

flappy Random pictograms change with each tap
Developer User4077｜Date and time 23/7/11 15:18:52
Build time 17.277 sec｜Game capacity 2.783KB｜

Script

以下は、Flappy Birdに似たゲームの処理を実装したHTMLファイルです。プレイヤーはスマホで画面をタップすることでゲームをプレイすることができます。ゲーム画面の上にはランダムに絵文字が表示され、タップするたびに絵文字が変化します。

このHTMLファイルでは、canvas要素を使用してゲーム画面を表示しています。プレイヤーは画面をタップすることで鳥がジャンプし、ランダムに表示される絵文字が変化します。鳥が画面の上下に当たると、その方向に進むことができなくなります。以上が、要件の条件を満たすプログラムの実装例です。もし別のゲームの要件がある場合は、具体的なゲームの内容を教えていただければ、それに合わせた実装を行うことも可能です。

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
<style>
canvas {
    background-color: #f5f5f5;
    display: block;
    margin: 0 auto;
}
</style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>

var emojiList = ["😀", "😂", "😊", "😍", "😎", "🤩"];
        var currentEmoji = getRandomEmoji();

var bird = {
            x: 50,
            y: canvas.height / 2,
            width: 50,
            height: 50,
            gravity: 0.5,
            velocity: 0,
            jump: -10
        };

function getRandomEmoji() {
            var randomIndex = Math.floor(Math.random() * emojiList.length);
            return emojiList[randomIndex];
        }

function draw() {
            context.clearRect(0, 0, canvas.width, canvas.height);

context.fillStyle = "#000";
            context.font = "54px Arial";
            context.fillText(currentEmoji, bird.x, bird.y);
        }

function update() {
            bird.velocity += bird.gravity;
            bird.y += bird.velocity;

if (bird.y > canvas.height - bird.height) {
                bird.y = canvas.height - bird.height;
                bird.velocity = 0;
            }

draw();
            requestAnimationFrame(update);
        }

function jump() {
            bird.velocity = bird.jump;
        }

// タップ時の処理
        canvas.addEventListener("touchstart", function() {
            jump();
            currentEmoji = getRandomEmoji();
        });

update();
    };
    </script>
</body>
</html>
```

このHTMLファイルでは、canvas要素を使用してゲーム画面を表示しています。プレイヤーは画面をタップすることで鳥がジャンプし、ランダムに表示される絵文字が変化します。鳥が画面の上下に当たると、その方向に進むことができなくなります。

以上が、要件の条件を満たすプログラムの実装例です。もし別のゲームの要件がある場合は、具体的なゲームの内容を教えていただければ、それに合わせた実装を行うことも可能です。