Very difficult shooting game's game

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

No:10744

←

Prev Next

→

Very difficult shooting game
Developer User4625｜Date and time 23/8/2 19:19:53
Build time 38.022 sec｜Game capacity 4.755KB｜

Script

了解しました。以下にシューティングゲームのサンプルコードを示します。

このコードは、HTMLのcanvas要素を使ってシューティングゲームを実装しています。ゲーム画面の上部にプレイヤーが表示され、下から敵が現れます。プレイヤーはスマホのタッチ操作で左右に動かせます。プレイヤーが画面の上端まで移動すると、画面上部に弾を発射します。プレイヤーの弾が敵に当たるとスコアが加算されます。敵が画面の下端に到達するとゲームオーバーになり、最終的なスコアが表示されます。また、ゲーム画面はリフレッシュレートに合わせて更新されます。画面のサイズが自動的に調整されるため、スマートフォンでも遊ぶことができます。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下にシューティングゲームのサンプルコードを示します。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>シューティングゲーム</title>
</head>
<body>
    <canvas id="gameCanvas"></canvas>

let playerX = canvas.width / 2;
        let playerY = canvas.height - playerSize;
        let bullets = [];
        let enemies = [];
        let gameScore = 0;
        let isGameOver = false;

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

function drawBullets() {
            ctx.fillStyle = "red";
            bullets.forEach(bullet => {
                ctx.fillRect(bullet.x, bullet.y, bulletSize, bulletSize);
            });
        }

function drawEnemies() {
            ctx.fillStyle = "green";
            enemies.forEach(enemy => {
                ctx.fillRect(enemy.x, enemy.y, enemySize, enemySize);
            });
        }

function moveBullets() {
            bullets.forEach(bullet => {
                bullet.y -= 5;
            });
            bullets = bullets.filter(bullet => bullet.y > 0);
        }

function updateGame() {
            if (!isGameOver) {
                ctx.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();
                drawBullets();
                drawEnemies();

moveBullets();
                moveEnemies();

detectCollision();

requestAnimationFrame(updateGame);
            } else {
                ctx.font = "30px Arial";
                ctx.fillStyle = "black";
                ctx.fillText("Game Over", canvas.width / 2 - 75, canvas.height / 2);
                ctx.fillText("Score: " + gameScore, canvas.width / 2 - 65, canvas.height / 2 + 40);
            }
        }

function handleTouchMove(event) {
            const touchX = event.touches[0].clientX;
            playerX = touchX - playerSize / 2;
        }

function handleTouchStart() {
            if (!isGameOver) {
                const bullet = {
                    x: playerX + playerSize / 2 - bulletSize / 2,
                    y: playerY - bulletSize
                };
                bullets.push(bullet);
            }
        }

function initializeGame() {
            canvas.width = window.innerWidth;
            canvas.height = window.innerHeight;

document.addEventListener("touchmove", handleTouchMove);
            document.addEventListener("touchstart", handleTouchStart);

const enemy = {
                x: Math.random() * (canvas.width - enemySize),
                y: 0
            };
            enemies.push(enemy);

updateGame();
        }

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

このコードは、HTMLのcanvas要素を使ってシューティングゲームを実装しています。

ゲーム画面の上部にプレイヤーが表示され、下から敵が現れます。プレイヤーはスマホのタッチ操作で左右に動かせます。プレイヤーが画面の上端まで移動すると、画面上部に弾を発射します。プレイヤーの弾が敵に当たるとスコアが加算されます。

敵が画面の下端に到達するとゲームオーバーになり、最終的なスコアが表示されます。また、ゲーム画面はリフレッシュレートに合わせて更新されます。

画面のサイズが自動的に調整されるため、スマートフォンでも遊ぶことができます。