如何在Flutter中实现这种设计？

问题描述

如何使用以下曲线在Flutter中进行此设计：https://i.stack.imgur.com/QMZrQ.png。我想知道我应该使用clipath还是堆栈小部件。因为元素在彼此之上。这有点令人困惑，因为一侧白色的小部件在背面，而另一侧黑色的小部件在白色

解决方法

希望您的设计是这样的：

class _SingInScreenState extends State<SingInScreen> {
double height;
double width;
@override
Widget build(BuildContext context) {
  height = MediaQuery.of(context).size.height;
  width = MediaQuery.of(context).size.width;
  return Scaffold(
    body: Column(
      children: [
        Container(
          height: height * .4,decoration: BoxDecoration(
            color: Colors.black,borderRadius: BorderRadius.only(
              bottomRight: Radius.circular(50),),Container(
          height: height * .6,color: Colors.black,child: Container(
            decoration: BoxDecoration(
              color: Colors.white,borderRadius: BorderRadius.only(
                topLeft: Radius.circular(50),height: height * .5,],);
}

}