Flutter 用颤振帆布在形状上切割一个孔

我如何使用颤振画布在形状上“切割一个孔”？ 我有一组相当复杂的形状，看起来像真实世界的物体。这个物体上有一个圆形矩形的洞

我真的很想从一个形状中减去一个错误，但是我找不到任何关于如何做的信息。

---

canvas.clipRRect（myRRect）

只删除

myRRect

未涵盖的所有内容。我想要相反的结果。i、 e.要在当前画布形状或多个形状中创建一个

myerrect

形状孔。

您可以在“自定义画师”中尝试使用不同的BlendMode，下面是您可以参考的示例之一：

class MyPaint extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    // below one is big circle and instead of this circle you can draw your shape here.
    canvas.drawCircle(Offset(200, 200), 100, Paint()
      ..color = Colors.orange[200]
      ..style = PaintingStyle.fill);

    // below the circle which you want to create a cropping part.
    RRect rRect = RRect.fromRectAndRadius(Rect.fromCenter(center: Offset(200, 200), width: 75, height: 75), Radius.circular(8));
    canvas.drawRRect(rRect, Paint()
      ..color = Colors.orange[200]
      ..style = PaintingStyle.fill
      ..blendMode = BlendMode.dstOut);

    canvas.save();
    canvas.restore();
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) {
    return true;
  }
}

在这里，我使用了

BlendMode.dstOut

，它将用于显示目标源，但仅限于两个源不重叠的地方

可以与操作一起使用来创建孔

定制画家：

class HolePainter扩展了CustomPainter{
@凌驾
空心油漆（帆布，尺寸）{
最终油漆=油漆（）；
paint.color=Colors.blue；
画布绘制路径(
联合收割机(
病理手术，
Path（）…addrect（rect.fromLTRBR（100100300300，半径圆形（10）），
路径（）
…添加椭圆（从圆开始的矩形（中心：偏移（200200），半径：50））
…关闭（），
),
油漆，
);
}
@凌驾
bool应重新绘制（自定义代理）{
返回null；
}
}

用法：

class EditAvatar扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“圆角矩形中的孔”），
),
车身：定制喷漆(
画家：Holepainer（），
子级：容器（），
),
}
}

结果:

当然，如果您希望孔为圆形矩形，只需减去

rect

，而不是

圆形

，解决方案是：

//圆圈内有空错误
最终路径路径=路径（）；
path.fillType=PathFillType.evenOdd；
addOval（从圆开始的矩形（中心：中心，半径：半径））；
path.addrect（rect.fromRectAndRadius(
矩形自圆（中心：中心，半径：半径/2），
半径：圆形（半径/10）；
画布.绘制路径（路径，绘制）；

---

谢谢你的建议。遗憾的是，我找不到任何符合我要求的blendmode。其中一些在顶部以黑色绘制最后一个形状，但大多数似乎什么也不做。我确实认为这是最好的方法，因为它1.适用于剪辑，2.适用于所有颤振渲染器（也适用于web）。