A game in which Red Bull is a sponger.'s game | AI game creator

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

No:1891

150

A game in which Red Bull is a sponger.
Developer User3025｜Date and time 23/6/19 12:57:28
Build time 53.243 sec｜Game capacity 4.452KB｜

では、レッドブルスポンサーのゲームを作ってみましょう。ゲームの概要：プレイヤーはレッドブルを飲んでエナジーをチャージしながら、障害物を避けながらゴールを目指すレースゲームです。以下が実際のプログラムです。絵文字も多めに使いながら、スマホでも操作しやすいように実装しています。

🏎

🚧

🏁

Energy: 0%

上記のプログラムを実行すると、レッドブルの車（🏎）、障害物（🚧）、ゴール（🏁）、エナジーチャージの表示が行われます。キーボードの上矢印キーと下矢印キーで車を移動できます。障害物に衝突するとゲームオーバーになります。また、エナジーチャージが0以下になるとゲームオーバーになります。レッドブルを飲んでエナジーをチャージすることで、より長い時間ゲームを続けることができます。最終的にゴールに到達するとゲームクリアです。以上が、レッドブルスポンサーのゲームの実装例になります。

→ 　

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>Red Bull Racing Game</title>
	<style>
	#player {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		left: 10%;
		font-size: 36px;
	}
	#obstacle {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		left: 80%;
		font-size: 36px;
	}
	#goal {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		left: 90%;
		font-size: 36px;
	}
	#energy {
		position: absolute;
		top: 10%;
		left: 10%;
		font-size: 24px;
		color: red;
	}
	</style>
</head>
<body>
	<div id="player">🏎</div>
	<div id="obstacle">🚧</div>
	<div id="goal">🏁</div>
	<div id="energy">Energy: 0%</div>
	<script>
	// ゲームの設定
	var playerPosition = 10; // プレイヤーの初期位置
	var obstaclePosition = 80; // 障害物の初期位置
	var goalPosition = 90; // ゴールの位置
	var energy = 0; // エナジーチャージの初期値
	var energyInterval = null; // エナジーチャージのタイマー
	var gameInterval = null; // ゲームのメインタイマー

// ゲームを開始する
	function startGame() {
		// エナジーチャージを開始する
		energyInterval = setInterval(chargeEnergy, 1000);
		// ゲームのメインタイマーを開始する
		gameInterval = setInterval(moveObjects, 100);
	}

// エナジーチャージをする
	function chargeEnergy() {
		energy += 10;
		if (energy >= 100) {
			energy = 100;
			clearInterval(energyInterval);
			energyInterval = null;
		}
		document.getElementById("energy").innerText = "Energy: " + energy + "%";
	}

// オブジェクトを移動する
	function moveObjects() {
		// プレイヤーを移動する
		if (isKeyPressed("ArrowUp")) {
			playerPosition -= 1;
			document.getElementById("player").style.top = playerPosition + "%";
		}
		if (isKeyPressed("ArrowDown")) {
			playerPosition += 1;
			document.getElementById("player").style.top = playerPosition + "%";
		}
		// 障害物を移動する
		obstaclePosition -= 2;
		if (obstaclePosition <= 0) {
			obstaclePosition = 110;
		}
		document.getElementById("obstacle").style.left = obstaclePosition + "%";
		// ゴールに到達した場合はゲームを終了する
		if (playerPosition >= goalPosition) {
			clearInterval(gameInterval);
			gameInterval = null;
			document.getElementById("energy").innerText = "Game Clear!";
		}
		// 衝突判定を行う
		if (Math.abs(playerPosition - obstaclePosition) <= 10) {
			clearInterval(gameInterval);
			gameInterval = null;
			document.getElementById("energy").innerText = "Game Over!";
		}
		// エナジーを消費する
		if (gameInterval !== null) {
			energy -= 1;
			if (energy <= 0) {
				clearInterval(energyInterval);
				energyInterval = null;
				clearInterval(gameInterval);
				gameInterval = null;
				document.getElementById("energy").innerText = "Game Over!";
			}
			document.getElementById("energy").innerText = "Energy: " + energy + "%";
		}
	}

// キーが押されたかどうか判定する
	function isKeyPressed(key) {
		var codeMap = {
			"ArrowUp": 38,
			"ArrowDown": 40,
			"ArrowLeft": 37,
			"ArrowRight": 39
		};
		return (event.type === "keydown" && event.keyCode === codeMap[key]);
	}

// ゲームを開始する
	document.body.addEventListener("keydown", startGame);
	</script>
</body>
</html>
```

上記のプログラムを実行すると、レッドブルの車（🏎）、障害物（🚧）、ゴール（🏁）、エナジーチャージの表示が行われます。キーボードの上矢印キーと下矢印キーで車を移動できます。障害物に衝突するとゲームオーバーになります。また、エナジーチャージが0以下になるとゲームオーバーになります。レッドブルを飲んでエナジーをチャージすることで、より長い時間ゲームを続けることができます。最終的にゴールに到達するとゲームクリアです。

以上が、レッドブルスポンサーのゲームの実装例になります。