在 Flutter 中创建此布局

Question

我正在尝试获得这个布局。橙色和红色是固定区域。白色可以是列表视图或 SingleChildScrollView。

这是抽屉...

所以白色区域的高度是灵活的。橙色和红色需要修复。

我尝试将 Column 与 mainAxisAlignment.spaceEvenly 一起使用，但没有成功。

谢谢！

Answer 1

Column(
      children: [
        Container(color: Colors.orange, height: orangeHeight),
        Expanded(
          child: Container(
            color: Colors.white,
            child: ListView(),
          ),
        ),
        Container(color: Colors.red, height: redHeight),
      ],
    )