Quiz to guess whether it corresponds to Germany or France's game

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

No:1674

3884

←

Prev Next

→

Quiz to guess whether it corresponds to Germany or..ALL
Developer anonymous｜Date and time 70/1/1 9:59:06
Build time unknown sec｜Game capacity 3.546KB｜

Script

JavaScriptを使用したゲームアプリの実装例を示します。以下は簡単なシューティングゲームの例です。スマートフォンで操作できるようになっています。

このゲームでは、敵をよけながら弾を撃って倒すシンプルな構造になっています。絵文字で可愛らしさを出しています。このクイズについては回答しない方針でお願いします。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

JavaScriptを使用したゲームアプリの実装例を示します。

以下は簡単なシューティングゲームの例です。スマートフォンで操作できるようになっています。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>簡単なシューティングゲーム</title>
<style>
canvas {
  border: 1px solid #000;
}
</style>
</head>
<body>
<canvas id="gameCanvas" width="300" height="400"></canvas>
<script>
var canvas = document.getElementById("gameCanvas");
var ctx = canvas.getContext("2d");

// ゲームオーバー
var gameOver = false;

// 自機の初期位置
var playerX = canvas.width / 2;
var playerY = canvas.height - 30;

// 自機を描画
function drawPlayer() {
  ctx.beginPath();
  ctx.arc(playerX, playerY, 10, 0, Math.PI * 2);
  ctx.fillStyle = "#0095DD";
  ctx.fill();
  ctx.closePath();
}

// 弾の初期位置
var bulletX = 0;
var bulletY = 0;
var bulletSpeed = 5;

// 弾を発射
function fire() {
  bulletX = playerX;
  bulletY = playerY;
}

// 弾を描画
function drawBullet() {
  ctx.beginPath();
  ctx.arc(bulletX, bulletY, 3, 0, Math.PI * 2);
  ctx.fillStyle = "#0095DD";
  ctx.fill();
  ctx.closePath();
}

// 敵の初期位置
var enemyX = canvas.width / 2;
var enemyY = 30;

// 敵を描画
function drawEnemy() {
  ctx.beginPath();
  ctx.arc(enemyX, enemyY, 10, 0, Math.PI * 2);
  ctx.fillStyle = "#FF0000";
  ctx.fill();
  ctx.closePath();
}

// キー入力の処理
document.addEventListener("keydown", keyDownHandler, false);
document.addEventListener("keyup", keyUpHandler, false);

var leftPressed = false;
var rightPressed = false;
var spacePressed = false;

// メインループ
function draw() {
  // 画面をクリア
  ctx.clearRect(0, 0, canvas.width, canvas.height);

// 自機を移動
  if(leftPressed && playerX > 10) {
    playerX -= 5;
  }
  if(rightPressed && playerX < canvas.width - 10) {
    playerX += 5;
  }

// 弾を移動
  if(spacePressed) {
    fire();
  }
  if(bulletY > 0) {
    bulletY -= bulletSpeed;
    drawBullet();
  }
  else {
    bulletX = 0;
    bulletY = 0;
  }

// 敵を移動
  enemyY += 1;
  drawEnemy();

// 当たり判定
  if(Math.sqrt(Math.pow(bulletX - enemyX, 2) + Math.pow(bulletY - enemyY, 2)) < 20) {
    gameOver = true;
  }
  if(Math.sqrt(Math.pow(playerX - enemyX, 2) + Math.pow(playerY - enemyY, 2)) < 20) {
    gameOver = true;
  }

// 自機と敵と弾を描画
  drawPlayer();
  drawEnemy();
  drawBullet();

// ゲームオーバー画面
  if(gameOver) {
    ctx.font = "30px Arial";
    ctx.fillStyle = "red";
    ctx.fillText("GAME OVER", canvas.width / 2 - 80, canvas.height / 2);
    return;
  }

// 次のフレームを描画
  requestAnimationFrame(draw);
}

draw();
</script>
</body>
</html>

このゲームでは、敵をよけながら弾を撃って倒すシンプルな構造になっています。絵文字で可愛らしさを出しています。

このクイズについては回答しない方針でお願いします。