Dart 如何塑造容器?

Dart 如何塑造容器?,dart,flutter,Dart,Flutter,我想制作不同形状的容器。 例如,将容器塑造成八角形等 提前感谢。您可以扩展CustomClipper并定义一个自定义路径,以便与ClipPath一起使用。还有其他预制作的剪辑小部件,如ClipOval和ClipRRect(带圆角的矩形)。下面是星形容器的示例 class _MyHomePageState extends State<MyHomePage> { @override Widget build(BuildContext context) { return

我想制作不同形状的容器。 例如,将容器塑造成八角形等


提前感谢。

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

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;
}
class\u MyHomePageState扩展状态{
@凌驾
小部件构建(构建上下文){
返回脚手架(
正文:ClipPath(
子:容器(
颜色:颜色。琥珀色,
),
裁剪器:_MyClipper(),
),
);
}
}
类MyClipper扩展了CustomClipper{
@凌驾
路径getClip(大小){
最终路径=路径();
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();
返回路径;
}
@凌驾
bool shouldReclip(CustomClipper oldClipper)=>false;
}

嗨,你能和我们分享一下你迄今为止的尝试吗?