Flutter 我无法设计以下UI

所以问题是我可以分别在UI中完成所有工作，但我无法放置显示高度和重量的框以及两个容器的连接点。我尝试使用Stack，但Stack的布局区域会根据其子部件中最大的小部件而变化。所以我试着做一个空容器，然后在上面加上深蓝色的容器，然后试着把另外两个容器放在绿色和白色容器的交界处，但它不起作用。它声明堆栈是无限长的，无法构建。我已经尝试了所有的方法：堆叠、变换

所以我想要的是帮助设计那个盒子并把它放在那个里。 我希望它能适用于任何大小的设备，也就是说，让这个完整的用户界面可以滚动，或者任何你们所建议的，因为我是这个世界上的新手

---

您可以这样做： juts复制、粘贴和理解堆栈小部件

class A extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var height = MediaQuery.of(context).size.height;
    var width = MediaQuery.of(context).size.width;
    return Scaffold(

      backgroundColor: Colors.grey[50],
      body: Stack(
        fit: StackFit.loose,
        children: [

        Container(
          color: Colors.green,
          height: height*.3,
          width: width,

          child: Text("Content"),
        ),
          Padding(
            padding:  EdgeInsets.only(top: height*.25),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [

                Card(
                  child: Container(
                    color: Colors.red,
                    height: 100,
                    width: width*.3,
                  )

                  ,
                ),
                Card(
                  child: Container(height: 100,
                    width: width*.3,
                  )

                  ,
                ),


              ],),
          ),






      ],),

    );
  }
}

---

您必须为此布局使用堆栈

---

或者您必须使用自定义画师绘制圆

您必须使用堆栈，然后在其中使用位置。