AI game creator

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

No:41370

←

Prev Next

→

Ein Kampf spiel
Developer User18520｜Date and time 24/2/7 3:57:16
Build time 14.605 sec｜Game capacity 3.325KB｜

Script

Hier ist ein Beispiel für ein einfaches Kampfspiel in JavaScript, das als einzelne HTML-Datei implementiert wurde:

Dieses Spiel verwendet ein Canvas-Element, um die Spielfläche zu erstellen. Der Spieler und der Gegner sind einfache rechteckige Spielfiguren, die mit der Funktion `drawPlayer()` bzw. `drawEnemy()` gezeichnet werden. Die Funktion `checkCollision()` überprüft, ob es eine Kollision zwischen dem Spieler und dem Gegner gibt. Bei einer Kollision wird das Spiel zurückgesetzt. Die Spielerbewegung wird durch den Tastenanschlag des Benutzers gesteuert, der durch den Event-Listener `handlePlayerMove(event)` erfasst wird. Die Funktion `updateGame()` aktualisiert das Spiel und zeichnet die Spielfiguren neu. Das Spiel läuft, indem die Funktion `updateGame()` alle 20 Millisekunden mit `setInterval(updateGame, 20)` aufgerufen wird. Das Beispiel ist sehr einfach gehalten, kann aber entsprechend erweitert und angepasst werden, um ein komplexeres Kampfspiel zu implementieren.

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

Hier ist ein Beispiel für ein einfaches Kampfspiel in JavaScript, das als einzelne HTML-Datei implementiert wurde:

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Kampfspiel</title>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>
  
  <script>
    // Variablen für das Spiel
    var canvas = document.getElementById("gameCanvas");
    var ctx = canvas.getContext("2d");
    var playerPosX = 200;
    var playerPosY = 200;
    var enemyPosX = 100;
    var enemyPosY = 100;
    var playerSize = 50;
    var enemySize = 50;
    var playerColor = "blue";
    var enemyColor = "red";
    
    // Funktionen zum Zeichnen der Spielfiguren
    function drawPlayer() {
      ctx.fillStyle = playerColor;
      ctx.fillRect(playerPosX, playerPosY, playerSize, playerSize);
    }
    
    function drawEnemy() {
      ctx.fillStyle = enemyColor;
      ctx.fillRect(enemyPosX, enemyPosY, enemySize, enemySize);
    }
    
    // Funktion zum Überprüfen der Kollision zwischen Spieler und Gegner
    function checkCollision() {
      if (playerPosX < enemyPosX + enemySize &&
          playerPosX + playerSize > enemyPosX &&
          playerPosY < enemyPosY + enemySize &&
          playerPosY + playerSize > enemyPosY) {
        // Kollision gefunden
        alert("Du hast den Gegner getroffen! Spiel vorbei.");
        resetGame();
      }
    }
    
    // Funktion zum Zurücksetzen des Spiels
    function resetGame() {
      playerPosX = 200;
      playerPosY = 200;
      enemyPosX = Math.random() * 350;
      enemyPosY = Math.random() * 350;
    }
    
    // Funktion zum Aktualisieren des Spiels und Neuzeichnen
    function updateGame() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      drawPlayer();
      drawEnemy();
      checkCollision();
    }
    
    // Funktion zum Behandeln der Spielerbewegung
    function handlePlayerMove(event) {
      var key = event.key;
      switch (key) {
        case "ArrowUp":
          playerPosY -= 10;
          break;
        case "ArrowDown":
          playerPosY += 10;
          break;
        case "ArrowLeft":
          playerPosX -= 10;
          break;
        case "ArrowRight":
          playerPosX += 10;
          break;
      }
    }
    
    // Spielstart
    document.addEventListener("keydown", handlePlayerMove);
    setInterval(updateGame, 20); // Aktualisierung alle 20 Millisekunden
  </script>
</body>
</html>
```

Das Beispiel ist sehr einfach gehalten, kann aber entsprechend erweitert und angepasst werden, um ein komplexeres Kampfspiel zu implementieren.