如何在Flutter中创建带圆角的自定义blured形状

Question

我想绘制一个类似于下图中标记区域的自定义形状。有没有办法用模糊效果剪辑这个自定义形状，然后指定角落的半径？

Answer 1

这不是您能找到的最佳解决方案，但它可以使用： full example

class customclipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    var path = new Path();
    path.lineTo(0.0, size.height - 20);
    path.quadraticBezierTo(0.0, size.height, 20.0, size.height);
    path.lineTo(size.width - 20.0, size.height);
    path.quadraticBezierTo(size.width, size.height, size.width, size.height - 20);
    path.lineTo(size.width, 50.0);
    path.quadraticBezierTo(size.width, 30.0, size.width - 20.0, 30.0);
    path.lineTo(20.0, 5.0);
    path.quadraticBezierTo(0.0, 0.0, 0.0, 20.0);
    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) => false;
}

1. 我使用 quadraticBezierTo
创建了所有圆角
2. 我在ClipPath中创建了一个Container
3. 我使用Colors.white70作为容器颜色