AI game creator

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

No:9526

119

←

Prev Next

→

Flash Hathaway
Developer User4369｜Date and time 23/7/26 0:16:19
Build time 30.388 sec｜Game capacity 3.711KB｜

Script

了解です。実際のゲームとして遊べるHTMLファイルを作成します。

このHTMLファイルでは、スマートフォンで遊ぶことを前提としています。ゲーム画面の中央に黄色の四角形がプレイヤーで、画面内にランダムな位置に赤色の四角形が敵です。プレイヤーの周りを敵が回りながら動いているというシンプルなゲームです。プレイヤーは矢印キーを使って操作します。敵にプレイヤーが触れるとスコアが増え、敵はランダムな位置に再配置されます。このHTMLファイルをブラウザで開くと、実際にゲームとして遊ぶことができます。

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

了解です。実際のゲームとして遊べるHTMLファイルを作成します。

```html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>閃光のハサウェイ</title>
    <style>
        html, body {
            margin: 0;
            padding: 0;
            background-color: black;
        }
        canvas {
            display: block;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>

const PLAYER_SIZE = 50;
            const PLAYER_SPEED = 10;
            const ENEMY_SIZE = 10;
            const ENEMY_SPEED = 3;

let playerX = canvas.width / 2 - PLAYER_SIZE / 2;
            let playerY = canvas.height / 2 - PLAYER_SIZE / 2;
            let enemyX = Math.random() * (canvas.width - ENEMY_SIZE);
            let enemyY = Math.random() * (canvas.height - ENEMY_SIZE);
            let score = 0;

function drawPlayer() {
                ctx.fillStyle = "yellow";
                ctx.fillRect(playerX, playerY, PLAYER_SIZE, PLAYER_SIZE);
            }

function drawEnemy() {
                ctx.fillStyle = "red";
                ctx.fillRect(enemyX, enemyY, ENEMY_SIZE, ENEMY_SIZE);
            }

function drawScore() {
                ctx.fillStyle = "white";
                ctx.font = "24px Arial";
                ctx.fillText(`Score: ${score}`, 10, canvas.height - 10);
            }

function update() {
                ctx.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();
                drawEnemy();
                drawScore();

if (playerX < enemyX + ENEMY_SIZE &&
                    playerX + PLAYER_SIZE > enemyX &&
                    playerY < enemyY + ENEMY_SIZE &&
                    playerY + PLAYER_SIZE > enemyY) {
                    score++;
                    enemyX = Math.random() * (canvas.width - ENEMY_SIZE);
                    enemyY = Math.random() * (canvas.height - ENEMY_SIZE);
                }

requestAnimationFrame(update);
            }

update();

function handleKeyDown(event) {
                switch (event.keyCode) {
                    case 37: // Left arrow key
                        playerX -= PLAYER_SPEED;
                        break;
                    case 38: // Up arrow key
                        playerY -= PLAYER_SPEED;
                        break;
                    case 39: // Right arrow key
                        playerX += PLAYER_SPEED;
                        break;
                    case 40: // Down arrow key
                        playerY += PLAYER_SPEED;
                        break;
                }
            }

document.addEventListener("keydown", handleKeyDown);
        }
    </script>
</body>
</html>
```

このHTMLファイルでは、スマートフォンで遊ぶことを前提としています。ゲーム画面の中央に黄色の四角形がプレイヤーで、画面内にランダムな位置に赤色の四角形が敵です。プレイヤーの周りを敵が回りながら動いているというシンプルなゲームです。

プレイヤーは矢印キーを使って操作します。敵にプレイヤーが触れるとスコアが増え、敵はランダムな位置に再配置されます。

このHTMLファイルをブラウザで開くと、実際にゲームとして遊ぶことができます。