如何在Flutter中在容器上创建侧面切割/切口？

Question

我确定某个地方有一个剪辑小部件可以做到，但是我找不到它。大多数文档都是关于如何使用底部的应用程序栏实现的。 CircularNotchedRectangle仅允许一流。这是我想要实现的。

当前我正在使用一个自定义的裁剪器，该裁剪器很近，但不完全正确。

class RightConcaveClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    return Path()
      ..lineTo(size.width, 0)
      ..cubicTo(size.width - 20, 25, size.width - 20, 30, size.width - 30, 30)
      ..cubicTo(size.width - 62, 30, size.width - 62, 70, size.width - 30, 70)
      ..cubicTo(size.width - 20, 70, size.width, 90, size.width, 90)
      ..lineTo(size.width, size.height)
      ..lineTo(0, size.height);
  }

  @override
  bool shouldReclip(CustomClipper old) {
    return old != this;
  }
}

Answer 1

您可以使用flutter_custom_clippers它有很多自定义的推剪，其中包括您想要的一个。检查以下屏幕截图。

检查link以获取该程序包支持的推剪的更多屏幕截图。

我希望它会有所帮助。