2d Pixel survival Water wotld's game

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

No:39604

117

←

Prev Next

→

2d Pixel survival Water wotld
Developer User17726｜Date and time 24/1/29 10:23:38
Build time 14.003 sec｜Game capacity 3.791KB｜

Script

Sure! Here's a simple 2D pixel survival game set in a water world. The game will be playable on a smartphone and uses pictograms for a visual representation.

This is a basic implementation of the game using HTML, CSS, and JavaScript. The game involves a player represented by a colored square navigating through a water world background. The player can be controlled using touch events on a smartphone, with the left half of the canvas for left/right movement and the top half for up/down movement. The player moves smoothly and can explore the water world. Please note that this is a simplified game and can be expanded upon to include enemies, collectibles, or additional gameplay mechanics based on your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

Sure! Here's a simple 2D pixel survival game set in a water world. The game will be playable on a smartphone and uses pictograms for a visual representation.

```html
<!DOCTYPE html>
<html>
  <head>
    <title>2D Pixel Survival: Water World</title>
    <style>
      body {
        font-family: 'Arial', sans-serif;
        text-align: center;
        margin: 0;
        padding: 0;
      }
      #game-container {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
      }
    </style>
  </head>
  <body>
    <div id="game-container">
      <canvas id="game-canvas" width="320" height="240"></canvas>
    </div>

// Handle touch events
      function handleTouchStart(event) {
        event.preventDefault();
        const touch = event.touches[0];
        if (touch.clientX < canvas.width / 2) {
          moveLeft = true;
        } else {
          moveRight = true;
        }
        if (touch.clientY < canvas.height / 2) {
          moveUp = true;
        } else {
          moveDown = true;
        }
      }

function handleTouchEnd(event) {
        event.preventDefault();
        moveLeft = false;
        moveRight = false;
        moveUp = false;
        moveDown = false;
      }

// Update player position
      function updatePlayerPosition() {
        if (moveLeft && playerX > 0) {
          playerX -= playerSpeed;
        }
        if (moveRight && playerX < canvas.width - playerSize) {
          playerX += playerSpeed;
        }
        if (moveUp && playerY > 0) {
          playerY -= playerSpeed;
        }
        if (moveDown && playerY < canvas.height - playerSize) {
          playerY += playerSpeed;
        }
      }

// Render game
      function render() {
        // Clear canvas
        context.clearRect(0, 0, canvas.width, canvas.height);

// Render water background
        context.fillStyle = waterColor;
        context.fillRect(0, 0, canvas.width, canvas.height);

// Render player
        context.fillStyle = playerColor;
        context.fillRect(playerX, playerY, playerSize, playerSize);

// Request next frame render
        requestAnimationFrame(render);
      }

// Start the game
      function startGame() {
        // Add touch event listeners
        canvas.addEventListener('touchstart', handleTouchStart);
        canvas.addEventListener('touchend', handleTouchEnd);

// Start game loop
        setInterval(function () {
          updatePlayerPosition();
        }, 10);

// Render game
        render();
      }

// Handle page loaded event
      document.addEventListener('DOMContentLoaded', startGame);
    </script>
  </body>
</html>
```

Please note that this is a simplified game and can be expanded upon to include enemies, collectibles, or additional gameplay mechanics based on your requirements.