Romantic Flight's game | AI game creator

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

No:3884

1023

Romantic Flight
Developer User3694｜Date and time 23/6/26 21:42:00
Build time 54.254 sec｜Game capacity 4.346KB｜

では、浪漫飛行というゲームを作成してみたいと思います。このゲームはスマホで遊べる縦スクロールシューティングゲームです。プレイヤーは青い飛行機を操り、敵の攻撃をかわしながら、画面をスライドして上下左右に移動し、敵を撃破します。プレイヤーのスコアは、撃破した敵の数によって決まります。以下が、HTMLとJavaScriptのコードです。

このコードを実行すると、スマホ上でプレイできる浪漫飛行が表示されます。プレイヤーが敵の攻撃をかわしながら敵を撃破し、スコアを競うことができます。また、スマホの画面をスライドすることで、プレイヤーを操作することができます。以上が、浪漫飛行というゲームの作成方法になります。絵文字を使うことはできませんでしたが、スマホ操作に対応した、シンプルで楽しいゲームができました。

→ 　

1　

0　

[PR]現在のプレゼントランキング

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

(C)2023 HisashiApp

では、浪漫飛行というゲームを作成してみたいと思います。

このゲームはスマホで遊べる縦スクロールシューティングゲームです。プレイヤーは青い飛行機を操り、敵の攻撃をかわしながら、画面をスライドして上下左右に移動し、敵を撃破します。プレイヤーのスコアは、撃破した敵の数によって決まります。

以下が、HTMLとJavaScriptのコードです。

```html
<!DOCTYPE html>
<html>
<head>
	<title>浪漫飛行</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: black;
			color: white;
			font-family: Arial, sans-serif;
		}
		
		canvas {
			display: block;
			margin: 0 auto;
		}
	</style>
</head>
<body>
	<canvas id="game" width="320" height="480"></canvas>
	<script>
		// ゲームの初期設定
		var canvas = document.getElementById("game");
		var ctx = canvas.getContext("2d");
		var player = {x: canvas.width/2 - 25, y: 400, w: 50, h: 50};
		var enemies = [];
		var enemySpeed = 3;
		var score = 0;
		var keys = {left: false, right: false, up: false, down: false};
		
		// イベントリスナーの設定
		canvas.addEventListener("touchstart", function(event) {
			event.preventDefault();
			var touch = event.touches[0];
			if (touch.pageX < player.x + player.w/2) {
				keys.left = true;
			}
			if (touch.pageX > player.x + player.w/2) {
				keys.right = true;
			}
			if (touch.pageY < player.y + player.h/2) {
				keys.up = true;
			}
			if (touch.pageY > player.y + player.h/2) {
				keys.down = true;
			}
		});
		
		canvas.addEventListener("touchend", function(event) {
			event.preventDefault();
			keys.left = false;
			keys.right = false;
			keys.up = false;
			keys.down = false;
		});
		
		// 敵の生成
		function spawnEnemy() {
			var x = Math.floor(Math.random() * (canvas.width - 50));
			var y = -50;
			var w = 50;
			var h = 50;
			enemies.push({x: x, y: y, w: w, h: h});
		}
		
		// ゲームのメインループ
		function gameLoop() {
			// プレイヤーの動き
			if (keys.left) {
				player.x -= 5;
			}
			if (keys.right) {
				player.x += 5;
			}
			if (keys.up) {
				player.y -= 5;
			}
			if (keys.down) {
				player.y += 5;
			}
			// プレイヤーが画面から出ないようにする
			if (player.x < 0) {
				player.x = 0;
			}
			if (player.x + player.w > canvas.width) {
				player.x = canvas.width - player.w;
			}
			if (player.y < 0) {
				player.y = 0;
			}
			if (player.y + player.h > canvas.height) {
				player.y = canvas.height - player.h;
			}
			// 敵の動き
			for (var i = 0; i < enemies.length; i++) {
				enemies[i].y += enemySpeed;
				// 敵が画面から出たら削除する
				if (enemies[i].y > canvas.height) {
					enemies.splice(i, 1);
					i--;
				}
				// プレイヤーと敵の衝突判定
				if (player.x + player.w > enemies[i].x && player.x < enemies[i].x + enemies[i].w && player.y + player.h > enemies[i].y && player.y < enemies[i].y + enemies[i].h) {
					// 衝突した敵を削除する
					enemies.splice(i, 1);
					i--;
					// スコアの加算
					score++;
				}
			}
			// スコアの表示
			ctx.font = "24px Arial";
			ctx.fillText("Score: " + score, 10, 30);
			// プレイヤーの描画
			ctx.fillStyle = "blue";
			ctx.fillRect(player.x, player.y, player.w, player.h);
			// 敵の描画
			for (var i = 0; i < enemies.length; i++) {
				ctx.fillStyle = "red";
				ctx.fillRect(enemies[i].x, enemies[i].y, enemies[i].w, enemies[i].h);
			}
			// 敵の生成
			if (Math.random() < 0.05) {
				spawnEnemy();
			}
			// ゲームの再生
			requestAnimationFrame(gameLoop);
		}
		
		// ゲームの開始
		gameLoop();
	</script>
</body>
</html>
```

このコードを実行すると、スマホ上でプレイできる浪漫飛行が表示されます。プレイヤーが敵の攻撃をかわしながら敵を撃破し、スコアを競うことができます。また、スマホの画面をスライドすることで、プレイヤーを操作することができます。

以上が、浪漫飛行というゲームの作成方法になります。絵文字を使うことはできませんでしたが、スマホ操作に対応した、シンプルで楽しいゲームができました。