Тетрис с помощью элемента canvas

Question

Нужно нарисовать с помощью канваса-тетрис, но дальше начального кода дело не пошло. Помогите.

var c = document.getElementById("c");
var ctx = c.getContext('2d');


ctx.strokeStyle = '#000000';
ctx.strokeRect(18, 18, 260, 450);


ctx.fillStyle = "rgb(255, 0, 0)";
ctx.fillRect(100, 50, 30, 30);

ctx.fillStyle = '#00ff00';
ctx.fill();

<canvas height='1200' width='1600' id='c'>FX</canvas>

Answer 1

В играх есть такая штука как игровой цикл. Вам нужно с помощью window.requestAnimationFrame (прошу почитать про эту функцию, или использовать setInterval вместо нее) перерисовивать вашу игры каждый кадр. Все очень удобно так как в функцию отрисовки можно запихнуть всю игровую логику, а сами фигуры представить как объекты с методом draw (ООП и ES6 классы вам в помощь).

БЛОГ НА HUSL

Тетрис с помощью элемента canvas

Ответы (1 шт):