Flutter MediaQuery 主体尺寸

Question

我正在尝试在正文中创建 3 个部分，但我希望这 3 个部分始终覆盖整个屏幕。

Container(
        height: MediaQuery.of(context).size.height / 3,
        width: double.infinity,
        color: Colors.red,
      ),

Result Screen

MediaQuery 以整个屏幕为引用，这就是为什么最后一个部分溢出与应用栏相同的高度。

有什么方法可以将正文用作 MediaQuery 的引用吗？

Answer 1

尝试将 Column 与被 Expanded 包裹的 child 一起使用，每个 child 都将具有相同的大小。

  Column(
        children: <Widget>[
          Expanded(
            child: Container(color: Colors.white),
          ),
          Expanded(
            child: Container(color: Colors.red),
          ),
          Expanded(
            child: Container(color: Colors.green),
          ),
        ],
      );