flutter Canvas 的一些操作 加深理解

1 canvas的scale操作。

void paint(Canvas canvas, Size size) {
  var width = size.width;
  var height = size.height;
  drawPaint.color = Colors.white;
  canvas.save();
  canvas.scale(2,2);
  canvas.drawCircle(Offset(width/2, height/2), 10, drawPaint);
  canvas.restore();
}

在画布放大之后，所有绘制的坐标值都会放大。比如绘制的圆心为(10,10),最后在restore之后显示的位置是(20,20)

2 canvas的rotate， translate 等操作。

当设置rotate，translate操作，其实是坐标系发生了改变，所有的操作都是基于这个坐标系进行。当操作完成之后，调用restore是把坐标系恢复。已经绘制的内容不会动。（之前一直以为发生旋转之后 坐标系没有发生改变，绘制完成之后，调用restore，这个时候绘制的内容会发生旋转，旋转到预期的位置）。