複雑な形テトリス's game

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

No:39662

←

Prev Next

→

複雑な形テトリス
Developer 食べる鶏と熱いタバスコ｜Date and time 24/1/29 19:22:01
Build time 28.338 sec｜Game capacity 5.766KB｜

Script

了解しました。以下に複雑な形のテトリスの実装例を示します。

このコードは、10x20のグリッド上でテトリスのブロックを操作するゲームを実装しています。スマートフォンで操作することを想定しているため、キーボードの入力ではなくタッチ操作を受け付けます。詳細な動作やプログラムの意図については、コメントなどで説明する必要がありますが、基本的なテトリスのゲームとしては遊べます。必要に応じて修正や追加の実装を行ってください。

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

了解しました。以下に複雑な形のテトリスの実装例を示します。

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

.grid {
            display: grid;
            grid-template-columns: repeat(10, 1fr);
            grid-template-rows: repeat(20, 1fr);
            gap: 1px;
            width: 320px;
            height: 640px;
            background-color: #c0c0c0;
            border: 1px solid #808080;
            box-sizing: border-box;
        }

.cell {
            background-color: #fff;
            border: 1px solid #808080;
            box-sizing: border-box;
        }

.tetromino {
            position: relative;
            width: calc(100% / 10);
            height: calc(100% / 20);
        }

.active {
            background-color: #ff0000;
        }
    </style>
</head>
<body>
    <div class="grid"></div>

let currentIndex = 0;
            let currentRotation = 0;

const tetrominoes = [
                [[1, columns + 1, columns * 2 + 1, columns * 2 + 2], [columns, columns + 1, columns + 2, columns * 2 + 2], [1, columns + 1, columns * 2 + 1, 2], [columns, columns + 1, columns + 2, columns * 2]],
                // Include other tetromino shapes here
            ];

function createGrid() {
                for (let i = 0; i < rows * columns; i++) {
                    const square = document.createElement('div');
                    square.classList.add('cell');
                    grid.appendChild(square);
                    squares.push(square);
                }
            }

function draw() {
                tetrominoes[currentIndex][currentRotation].forEach(index => {
                    squares[currentIndex + index].classList.add('tetromino', 'active');
                });
            }

function undraw() {
                tetrominoes[currentIndex][currentRotation].forEach(index => {
                    squares[currentIndex + index].classList.remove('tetromino', 'active');
                });
            }

function moveDown() {
                undraw();
                currentIndex += columns;
                draw();
                freeze();
            }

function freeze() {
                const hitBottom = tetrominoes[currentIndex][currentRotation].some(index => squares[currentIndex + columns + index].classList.contains('cell'));
                if (hitBottom) {
                    tetrominoes[currentIndex][currentRotation].forEach(index => squares[currentIndex + index].classList.remove('tetromino', 'active'));
                    currentIndex = 0;
                    currentRotation = 0;
                    draw();
                }
            }

function moveLeft() {
                undraw();
                const isAtLeftEdge = tetrominoes[currentIndex][currentRotation].some(index => (currentIndex + index) % columns === 0);
                if (!isAtLeftEdge) currentIndex -= 1;
                if (tetrominoes[currentIndex][currentRotation].some(index => squares[currentIndex + index].classList.contains('cell'))) currentIndex += 1;
                draw();
            }

function moveRight() {
                undraw();
                const isAtRightEdge = tetrominoes[currentIndex][currentRotation].some(index => (currentIndex + index) % columns === columns - 1);
                if (!isAtRightEdge) currentIndex += 1;
                if (tetrominoes[currentIndex][currentRotation].some(index => squares[currentIndex + index].classList.contains('cell'))) currentIndex -= 1;
                draw();
            }

createGrid();
            draw();

document.addEventListener('keydown', control);
        });
    </script>
</body>
</html>
```

このコードは、10x20のグリッド上でテトリスのブロックを操作するゲームを実装しています。スマートフォンで操作することを想定しているため、キーボードの入力ではなくタッチ操作を受け付けます。

詳細な動作やプログラムの意図については、コメントなどで説明する必要がありますが、基本的なテトリスのゲームとしては遊べます。必要に応じて修正や追加の実装を行ってください。