首页 > 解决方案 > 为从容器创建的 ClipPath 添加阴影 - Flutter

问题描述

我想为从 Container 创建的 ClipPath 添加阴影。这是我创建的 ClipPath:

              ClipPath(
                clipper: RibbonClipper(),
                child: Container(
                  height: 20,
                  width: 80,
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(5.0),
                      bottomLeft: Radius.circular(5.0),
                    ),
                    color: Color(0xFF338D5E),
                  ),
                ),
              ), 

而 CustomClipper 路径是:

  @override
  Path getClip(Size size) {
    var path = Path();
    path.lineTo(0, size.height);
    path.lineTo(size.width, size.height);
    path.lineTo(size.width * .90, size.height * .5);
    path.lineTo(size.width, 0);
    return path;
  }

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

标签: flutterflutter-layoutshadowclip-pathflutter-widget

解决方案


不久前我不得不这样做。我发现这个结合了 ClipPath 和阴影的非常有用的要点。或者,似乎有人把它做成了 package,但我没有测试它。


推荐阅读