Flutter 使用ClipPath时，波浪曲线不平滑

我必须创建一条如下所示的曲线：

这是我的代码，试图使曲线。但这是一条直线

ClipPath(
  clipper: ArrowClipper(),
  child: Container(
    width: 35,
    height: 110,
    color: Color(0xFF3F3C5F),
    child: isOpenedAsync.data
           ? Icon(Icons.chevron_right)
           : Icon(Icons.chevron_left),
    ),
),

克利伯级

class ArrowClipper extends CustomClipper<Path> {
  @override
  getClip(Size size) {
    Paint paint = Paint();
    paint.color = Variables.backgroundColor;
    Path path = Path();
    final w = size.width; // 35
    final h = size.height; // 110

    path.moveTo(w, 0);
    path.quadraticBezierTo(w, 2, w - 2, 2);
    path.quadraticBezierTo(1, (h/2) - 2, 0, h/2);
    path.quadraticBezierTo(0, h, 2, (h/2) + 2);
    path.quadraticBezierTo(w-2, h - 2, w, h);
    path.close();

    return path;
  }

  @override
  bool shouldReclip(CustomClipper oldClipper) {
    return true;
  }
}

类ArrowClipper扩展了CustomClipper{
@凌驾
getClip（大小）{
油漆=油漆（）；
paint.color=Variables.backgroundColor；
路径=路径（）；
最终w=大小。宽度；//35
最终h=尺寸。高度；//110
路径移动到（w，0）；
二次贝塞尔托路径（w，2，w-2，2）；
路径二次Bezierto（1，（h/2）-2,0，h/2）；
路径二次Bezierto（0，h，2，（h/2）+2）；
二次贝塞尔托路径（w-2，h-2，w，h）；
path.close（）；
返回路径；
}
@凌驾
bool shouldReclip（CustomClipper oldClipper）{
返回true；
}
}

上述代码的输出如下：

---

感谢@Andreas。我需要使用

path.cubicTo（）

，而不是

path.quadraticBezierTo（）

---

检查他们是如何在

CircularNotchedRectangle

中执行此操作的，或者直接使用该类来获取您的

路径

@pskink您可以详细说明一下吗？查看sources@pskink我已经在使用

Path

类。

    path.moveTo(w, 0);
    path.cubicTo(
        w, h * 0.35,
        w * 0.025, h * 0.4,
        0, h * 0.5);
    path.cubicTo(
        w * 0.025, h * 0.7,
        w, h * 0.6,
        w, h);
    path.close();