Hurry up with the appeasement of the howsk!!!! 🤬💢game's game

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

No:3749

←

Prev Next

→

Hurry up with the appeasement of the howsk!!!! 🤬💢g..ALL
Developer どうスクのアプデ早くしろよ！🤬💢｜Date and time 23/6/26 12:50:37
Build time 38.169 sec｜Game capacity 3.355KB｜

Script

はじめにプレイヤーが画面上の四角形を操作し、障害物を避けながらスコアを競う簡単なゲームを作りました。以下が実装したHTMLファイルのコードです（Javascriptは``タグで囲んでいます）：

このプログラムは、画面をタッチして操作することでプレイヤーを移動させ、青色の四角形を避けつつ赤色の四角形（障害物）を避けていくゲームです。スコアはゲーム中に左上に表示され、一定時間ごとに障害物が追加され難易度が上がります。障害物に接触するとゲームオーバーになってスコアが表示され、画面がリロードされます。以上が私が作成した単純なゲームになります。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

はじめにプレイヤーが画面上の四角形を操作し、障害物を避けながらスコアを競う簡単なゲームを作りました。

以下が実装したHTMLファイルのコードです（Javascriptは`<script>`タグで囲んでいます）：

```
<!DOCTYPE html>
<html>
<head>
	<title>四角形ゲーム</title>
	<style>
		body {
			margin: 0;
			padding: 0;
		}
		canvas {
			background: black;
			display: block;
			margin: auto;
		}
	</style>
</head>
<body>
	<canvas id="canvas"></canvas>

// プレイヤーの四角形を定義
		let player = {
			x: canvas.width / 2,
			y: canvas.height / 2,
			size: 20,
			speed: 5
		};

// タッチ操作でプレイヤーを動かす
		canvas.addEventListener('touchmove', function(e) {
			e.preventDefault();
			player.x = e.touches[0].clientX;
			player.y = e.touches[0].clientY;
		}, false);

// 障害物を定義
		let obstacles = [];
		function spawnObstacle() {
			let obstacle = {
				x: Math.random() * canvas.width,
				y: 0,
				size: Math.random() * (50 - 10) + 10,
				speed: Math.random() * (8 - 2) + 2
			};
			obstacles.push(obstacle);
		}

// 主なゲームループ
		let score = 0;
		function loop() {
			requestAnimationFrame(loop);
			ctx.clearRect(0, 0, canvas.width, canvas.height);

// プレイヤーを描画
			ctx.fillStyle = 'white';
			ctx.fillRect(player.x - player.size / 2, player.y - player.size / 2, player.size, player.size);

// 障害物を描画・移動
			for (let i = 0; i < obstacles.length; i++) {
				ctx.fillStyle = 'red';
				ctx.fillRect(obstacles[i].x - obstacles[i].size / 2, obstacles[i].y - obstacles[i].size / 2, obstacles[i].size, obstacles[i].size);
				obstacles[i].y += obstacles[i].speed;

// 障害物に当たった場合ゲームオーバー
				if (obstacles[i].y + obstacles[i].size / 2 > player.y - player.size / 2 && obstacles[i].y - obstacles[i].size / 2 < player.y + player.size / 2 &&
					obstacles[i].x + obstacles[i].size / 2 > player.x - player.size / 2 && obstacles[i].x - obstacles[i].size / 2 < player.x + player.size / 2) {
					alert('ゲームオーバー！\nスコア: ' + score);
					location.reload();
				}

// ウィンドウ下端まで行ったら削除
				if (obstacles[i].y + obstacles[i].size / 2 > canvas.height) {
					obstacles.splice(i, 1);
					i--;
				}
			}

// スコアを更新
			score++;
			ctx.fillStyle = 'white';
			ctx.font = '30px Arial';
			ctx.fillText('スコア: ' + score, 20, 40);

// 一定時間ごとに障害物を追加
			if (score % 60 == 0) {
				spawnObstacle();
			}
		}
		loop();
	</script>
</body>
</html>
```

以上が私が作成した単純なゲームになります。