AI game creator

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

No:29069

←

Prev Next

→

マージゲーム
Developer User14385｜Date and time 23/12/15 21:50:09
Build time 72.872 sec｜Game capacity 7.035KB｜

Script

了解しました。以下は、スマホで遊べる簡単なマージゲームの実装例です。

このプログラムは、矢印キーでタイルを操作するシンプルなマージゲームです。ブラウザで表示し、スマホの画面で操作して遊ぶことができます。ゲームボードは4x4のタイルで構成されており、同じ数字のタイルを重ねていくと値が倍増していきます。ゲームボード上で2048のタイルを作ることが目標です。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下は、スマホで遊べる簡単なマージゲームの実装例です。

```html
<!DOCTYPE html>
<html>
<head>
  <title>Merge Game</title>
  <style>
    body {
      background-color: #f2f2f2;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      margin: 0;
    }

.game-board {
      display: grid;
      grid-template-columns: repeat(4, 80px);
      gap: 8px;
    }

.tile {
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: #ccc;
      color: white;
      font-size: 24px;
      font-weight: bold;
      width: 80px;
      height: 80px;
    }
  </style>
</head>
<body>
  <div id="game-board" class="game-board">
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
    <div class="tile"></div>
  </div>

// ゲームボードの要素と初期化
    const gameBoard = document.getElementById('game-board');
    updateBoard();

// キー入力のイベントリスナーを追加
    document.addEventListener('keydown', function(event) {
      event.preventDefault();
      
      // キーコードに応じて方向を判断
      switch (event.keyCode) {
        case 37: // Left
          moveLeft();
          break;
        case 38: // Up
          moveUp();
          break;
        case 39: // Right
          moveRight();
          break;
        case 40: // Down
          moveDown();
          break;
      }
      
      // 新しいタイルをランダムに追加
      addNewTile();
      
      // ゲームボードの表示を更新
      updateBoard();
    });

// タイルを左に移動
    function moveLeft() {
      for (let rowIndex = 0; rowIndex < 4; rowIndex++) {
        for (let columnIndex = 1; columnIndex < 4; columnIndex++) {
          let current = tiles[rowIndex * 4 + columnIndex];
          let prevIndex = rowIndex * 4 + columnIndex - 1;
          let prev = tiles[prevIndex];
          
          if (prev.value === 0) {
            prev.value = current.value;
            current.value = 0;
          } else if (prev.value === current.value && !prev.merged && !current.merged) {
            prev.value *= 2;
            current.value = 0;
            prev.merged = true;
          }
        }
      }
      resetMergeState();
    }

// タイルを上に移動
    function moveUp() {
      for (let columnIndex = 0; columnIndex < 4; columnIndex++) {
        for (let rowIndex = 1; rowIndex < 4; rowIndex++) {
          let current = tiles[rowIndex * 4 + columnIndex];
          let prevIndex = (rowIndex - 1) * 4 + columnIndex;
          let prev = tiles[prevIndex];
          
          if (prev.value === 0) {
            prev.value = current.value;
            current.value = 0;
          } else if (prev.value === current.value && !prev.merged && !current.merged) {
            prev.value *= 2;
            current.value = 0;
            prev.merged = true;
          }
        }
      }
      resetMergeState();
    }

// タイルを右に移動
    function moveRight() {
      for (let rowIndex = 0; rowIndex < 4; rowIndex++) {
        for (let columnIndex = 2; columnIndex >= 0; columnIndex--) {
          let current = tiles[rowIndex * 4 + columnIndex];
          let nextIndex = rowIndex * 4 + columnIndex + 1;
          let next = tiles[nextIndex];
          
          if (next.value === 0) {
            next.value = current.value;
            current.value = 0;
          } else if (next.value === current.value && !next.merged && !current.merged) {
            next.value *= 2;
            current.value = 0;
            next.merged = true;
          }
        }
      }
      resetMergeState();
    }

// タイルを下に移動
    function moveDown() {
      for (let columnIndex = 0; columnIndex < 4; columnIndex++) {
        for (let rowIndex = 2; rowIndex >= 0; rowIndex--) {
          let current = tiles[rowIndex * 4 + columnIndex];
          let nextIndex = (rowIndex + 1) * 4 + columnIndex;
          let next = tiles[nextIndex];
          
          if (next.value === 0) {
            next.value = current.value;
            current.value = 0;
          } else if (next.value === current.value && !next.merged && !current.merged) {
            next.value *= 2;
            current.value = 0;
            next.merged = true;
          }
        }
      }
      resetMergeState();
    }

// マージ状態をリセット
    function resetMergeState() {
      for (let i = 0; i < 16; i++) {
        tiles[i].merged = false;
      }
    }

// 新しいタイルをランダムに追加
    function addNewTile() {
      let emptyIndices = getRandomEmptyIndices();
      if (emptyIndices.length > 0) {
        let randomIndex = emptyIndices[Math.floor(Math.random() * emptyIndices.length)];
        tiles[randomIndex].value = Math.random() < 0.9 ? 2 : 4;
      }
    }

// 空のタイルのインデックスを取得
    function getRandomEmptyIndices() {
      let emptyIndices = [];
      for (let i = 0; i < 16; i++) {
        if (tiles[i].value === 0) {
          emptyIndices.push(i);
        }
      }
      return emptyIndices;
    }

// ゲームボードの表示を更新
    function updateBoard() {
      gameBoard.innerHTML = '';
      for (let tile of tiles) {
        let tileElement = document.createElement('div');
        tileElement.classList.add('tile');
        tileElement.innerText = tile.value > 0 ? tile.value : '';
        gameBoard.appendChild(tileElement);
      }
    }
  </script>
</body>
</html>
```