我正在尝试创建Breakout游戏的简单克隆。
如何在某些(x,y)位置渲染网格中的所有块?
该应用程序显示块,但所有块都在同一位置。
class Block {
Random random = Random();
Rect rect;
Paint paint;
Size size;
Block({this.size}) {
rect = Rect.fromLTWH(
16,
16,
50,
25);
paint = Paint()..color = Colors.white;
}
void render(Canvas canvas){
canvas.drawRect(rect, paint);
}
void update(double td){
}
}
class TestGame extends Game {
Size screenSize;
TestGame(this.screenSize);
@override
void render(Canvas canvas) {
for(var i=0; i < 5; i++){
Block(size: screenSize).render(canvas);
}
}
@override
void update(double t) {}
}
最佳答案
现在,由于您不更改Rect
的坐标,因此所有块都在同一位置呈现。
您的Block
类需要获取要放置图块的位置的坐标,如下所示:
static final int width = 50;
static final int height = 25;
Block(**int x, int y**) {
rect = Rect.fromLTWH(**x**, **y**, Block.width, Block.height);
paint = Paint()..color = Colors.white;
}
然后在生成它们时,需要在render函数的循环中为它们提供不同的坐标,如下所示:
@override
void render(Canvas canvas) {
for(int i = 0; i < 6; i++) {
for(int j = 0; < 5; j++) {
// This could be moved out to the constructor and put in a list so that
// you wont have to make a new object in every render
Block((i+1)*Block.width, (j+2)*Block.height);
}
}
}
(坐标的i + 1和j + 2使其看起来像图像中的图像,如果删除+1和+2,则将在左上角开始渲染)
现在看起来就像是一大块白色,但是如果您在每个图块之间留出一定的空间,为它们提供不同的颜色或边缘,您将看到所有图块。
最简单的查看方法是:
paint.style = PaintingStyle.stroke;