0

私はこれを持っています：

var ctx = canvas.getContext( '2d' );

....
....

ctx.fillStyle = 'blue';

私が実際に変える必要があるのは、テトリス ゲームの形状です。それらは次のように書かれています。

var shapes = [
[ 1, 1, 1, 1 ],

[ 1, 1, 1, 0,
  1 ],

[ 1, 1, 1, 0,
  0, 0, 1 ],

[ 1, 1, 0, 0,
  1, 1 ],

[ 1, 1, 0, 0,
  0, 1, 1 ],

[ 0, 1, 1, 0,
  1, 1 ],

[ 0, 1, 0, 0,
  1, 1, 1 ]
];

[1,1,1,1]または形状[0]である最初の色を変更したいのですが、私が試したもののどれも機能しません。ctx.fillStyle = '青'; 動作しますが、すべてのオブジェクトの色が変わります。

ライブバージョンはここで見ることができます:

http://harlem-shake-it.com/tetris/

4

1 に答える 1

0

このコードから、現在のオブジェクトのみを青色にしたいと思いますか?

for (var y = 0; y < 4; ++y) {
    for (var x = 0; x < 4; ++x) {
        if (current[y][x]) {
            ctx.fillStyle = '#0068ff';
            drawBlock(currentX + x,currentY + y);
        }
    }
}

その場合は、まず現在のキャンバスの状態を で保存しctx.save();、fillStyle を使用してブロックを描画し、次にctx.restore();. これにより、必要に応じてブロックを複数の色で塗りつぶすことができます。または、この場合、落下したブロックを黒くレンダリングします。

doctype :も宣言する必要があります<!doctype html>。そして、<center>タグは非推奨です。text-align: center;今後の CSSで使用するmargin: 0 auto;か、スタイリングする内容に応じて使用する必要があります。

于 2013-04-24T02:39:31.880 に答える