如何在颤动中实现倾斜的路径（以这张照片为例）答案

【问题标题】：How can I achieve an inclined looking path in flutter (taking this picture as example)如何在颤动中实现倾斜的路径（以这张照片为例）
【发布时间】：2021-09-09 11:35:28
【问题描述】：

我想要达到的路径

我一直在尝试实现这条路径，但是在裁剪时遇到了麻烦，不仅裁剪了容器的相对部分，而且还弄脏了我的路径。

我也在寻求实现相同的效果，但方向相反。

这是我到目前为止所做的代码（它是一个向上的弧形剪辑路径）：

class UpArcClip extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    final path = Path();
    path.lineTo(0, size.height);
    path.lineTo(0.0, size.height - 100);
    path.quadraticBezierTo(
        size.width / 2, size.height, size.width, size.height - 100);
    path.lineTo(size.width, 0.0);
    path.close();
    return path;
  }

  @override
  bool shouldReclip(CustomClipper old) => false;
}

【问题讨论】：

标签： flutter dart user-interface flutter-web flutter-animation

【解决方案1】：

已经自己实现了：

class LeftInclinedArcClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    final path = Path();
    path.moveTo(0, size.height);
    path.lineTo(0, size.height * 0.7);
    path.quadraticBezierTo(
        size.width / 3, size.height * 0.45, size.width, size.height * 0.53);
    path.lineTo(size.width, size.height);
    path.close();
    return path;
  }

  @override
  bool shouldReclip(CustomClipper old) => false;
}

【讨论】：