如何塑造容器?

时间:2018-10-31 01:04:29

标签: dart flutter

我想在扑打中制作出不同形状的容器。 例如,将容器成形为八边形等。

谢谢。

1 个答案:

答案 0 :(得分:3)

您可以扩展CustomClipper并定义要与ClipPath一起使用的自定义路径。还有其他预制的剪辑小部件,例如ClipOvalClipRRect(带有圆角的矩形)。以下是星形Container的示例。

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ClipPath(
        child: Container(
          color: Colors.amber,
        ),
        clipper: _MyClipper(),
      ),
    );
  }
}

class _MyClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    final path = Path();
    path.lineTo(size.width * 0.5, size.height * 0.15);
    path.lineTo(size.width * 0.35, size.height * 0.4);
    path.lineTo(0.0, size.height * 0.4);
    path.lineTo(size.width * 0.25, size.height * 0.55);
    path.lineTo(size.width * 0.1, size.height * 0.8);
    path.lineTo(size.width * 0.5, size.height * 0.65);
    path.lineTo(size.width * 0.9, size.height * 0.8);
    path.lineTo(size.width * 0.75, size.height * 0.55);
    path.lineTo(size.width, size.height * 0.4);
    path.lineTo(size.width * 0.65, size.height * 0.4);
    path.lineTo(size.width * 0.5, size.height * 0.15);

    path.close();
    return path;
  }

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

enter image description here