dart - 如何更改 Flutter 中自定义绘画的来源？

Question

CustomPaint 代码:

return new Scaffold(
  body:
     new GestureDetector(
        onTap: () {
          debugPrint("hello");
        },
        child:
            new Container(
                alignment: FractionalOffset.center,
                child: new CustomPaint(

                     size: new Size(400.0, 400.0),
                     painter: new BarChartPainter(currentHeight),
    ))),
); 


  //x axis code 
  canvas.drawLine(new Offset(0.0, 0.0), new Offset(500.0, 0.0), paintAx);```

x 轴代码将绘制从 (0,0) 到 (500,0) 的线，位于 Paint 框的顶部。原点位于框的左上角。如何更改原点，使 (0,0) 位于颜料盒的左下方？

截图如下:

Answer 1

只需在 Canvas 中使用翻译方法:canvas.translate(0, size.height)。但请注意，在这种情况下，您需要在 y 轴上使用负值。

如果你想让你的 Canvas 坐标表现得像一个经典的图形，使用方法scale:

  @override
  void paint(Canvas canvas, Size size) {
    canvas.translate(0, size.height);
    canvas.scale(1, -1);
    final paint = Paint();
    paint.color = Colors.black;
    canvas.drawLine(Offset.zero, Offset(500, 500), paint);
  }