シューティングゲーム's game | AI game creator

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

No:35515

39

シューティングゲーム
Developer User16570｜Date and time 24/1/14 18:27:30
Build time 21.667 sec｜Game capacity 4.516KB｜

了解です。以下にシューティングゲームの基本的な実装例を示します。

このプログラムでは、プレイヤーが画面下から円を操作し、タッチ操作することで円を発射して敵（プレイヤー自身）に当てるシューティングゲームを実装しています。プレイヤーの位置や弾の位置を管理し、描画するために`player`と`bullets`というオブジェクトを使用しています。タッチ開始と終了のイベントリスナーを使用し、タッチ操作に対応しています。また、`gameLoop`関数を使用してゲームのメインループを実装し、プレイヤーや弾の位置の更新、描画を行っています。このコードを実行すると、シューティングゲームが表示され、タッチ操作によってプレイヤーが操作できます。プレイヤーが弾を発射すると当たり判定が行われ、プレイヤー自身に当たった場合はゲームオーバーとなります。このプログラムは基本的な実装例であり、デザインやゲームルールの追加、他のオブジェクトの追加など、さらなる改良や拡張が可能です。

→ 　

0　

0　

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

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

(C)2023 HisashiApp

了解です。以下にシューティングゲームの基本的な実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>シューティングゲーム</title>
	<style>
		canvas {
			border: 1px solid black;
		}
	</style>
</head>
<body>
	<canvas width="400" height="400"></canvas>
	
	<script>
		// ゲームの初期設定
		var canvas = document.querySelector("canvas");
		var context = canvas.getContext("2d");

var player = {
			x: canvas.width / 2,
			y: canvas.height - 30,
			radius: 10,
			color: "red",
			speed: 6,
			direction: 0,
			shotCoolDown: 0
		};

var bullets = [];

canvas.addEventListener("touchstart", handleTouchStart);
		canvas.addEventListener("touchend", handleTouchEnd);

// プレイヤーを描画する関数
		function drawPlayer() {
			context.beginPath();
			context.arc(player.x, player.y, player.radius, 0, Math.PI * 2);
			context.fillStyle = player.color;
			context.fill();
			context.closePath();
		}

// 弾を描画する関数（複数の弾を描画）
		function drawBullets() {
			bullets.forEach(function(bullet) {
				context.beginPath();
				context.arc(bullet.x, bullet.y, bullet.radius, 0, Math.PI * 2);
				context.fillStyle = bullet.color;
				context.fill();
				context.closePath();
			});
		}

// メインゲームループ
		function gameLoop() {
			updatePlayer();
			updateBullets();
			drawPlayer();
			drawBullets();
			requestAnimationFrame(gameLoop);
		}

// プレイヤーの動きを更新する関数
		function updatePlayer() {
			// プレイヤーの位置を更新する
			player.x += player.direction * player.speed;

// プレイヤーが画面外に出ないように制限する
			if (player.x < player.radius) {
				player.x = player.radius;
			} else if (player.x > canvas.width - player.radius) {
				player.x = canvas.width - player.radius;
			}

// ショットクールダウンを更新する
			if (player.shotCoolDown > 0) {
				player.shotCoolDown--;
			}
		}

// 弾の動きと当たり判定を更新する関数
		function updateBullets() {
			bullets.forEach(function(bullet, index) {
				// 弾を上に移動させる
				bullet.y -= bullet.speed;

// 弾が画面外に出たら削除する
				if (bullet.y < bullet.radius) {
					bullets.splice(index, 1);
				}

// 弾の当たり判定チェック
				if (
					bullet.y > player.y - player.radius &&
					bullet.y < player.y + player.radius &&
					bullet.x > player.x - player.radius &&
					bullet.x < player.x + player.radius
				) {
					// 当たった場合の処理（ここではゲームオーバー）
					alert("ゲームオーバー");
					location.reload();
				}
			});
		}

// 画面タッチ時の処理（ショットの発射）
		function handleTouchStart(event) {
			event.preventDefault();
			player.shotCoolDown++;
			if (player.shotCoolDown === 1) {
				shoot();
			}
		}

// 画面タッチ終了時の処理（ショットクールダウンのリセット）
		function handleTouchEnd(event) {
			event.preventDefault();
			player.shotCoolDown = 0;
		}

// 弾を発射する関数
		function shoot() {
			var bullet = {
				x: player.x,
				y: player.y,
				radius: 5,
				color: "blue",
				speed: 10
			};
			bullets.push(bullet);
		}

// ゲームを開始する
		gameLoop();
	</script>
</body>
</html>
```

このプログラムでは、プレイヤーが画面下から円を操作し、タッチ操作することで円を発射して敵（プレイヤー自身）に当てるシューティングゲームを実装しています。 プレイヤーの位置や弾の位置を管理し、描画するために`player`と`bullets`というオブジェクトを使用しています。 タッチ開始と終了のイベントリスナーを使用し、タッチ操作に対応しています。 また、`gameLoop`関数を使用してゲームのメインループを実装し、プレイヤーや弾の位置の更新、描画を行っています。

このコードを実行すると、シューティングゲームが表示され、タッチ操作によってプレイヤーが操作できます。 プレイヤーが弾を発射すると当たり判定が行われ、プレイヤー自身に当たった場合はゲームオーバーとなります。

このプログラムは基本的な実装例であり、デザインやゲームルールの追加、他のオブジェクトの追加など、さらなる改良や拡張が可能です。