时间戳

首页 > 解决方案 > Flutter root Column 小部件扩展到整个屏幕，为什么？

dart - Flutter root Column 小部件扩展到整个屏幕，为什么？

问题描述

我是颤振/飞镖的新手，我只是在寻找我的脚。

一直在玩一个非常简单的测试 UI。我正在使用 Material App 和 Scaffold 小部件，并将 Column 小部件放置在 Scaffold 小部件的“主体”中。当我使用检查小部件工具时，它会自动扩展以占据整个屏幕。

这是代码..

class TestWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Text('bob'),
        ],
      ),
    );
  }
}

如果我然后嵌套一个 Column 小部件，它不会像其父级那样扩展以占用垂直空间，我可以更改它并使用像这样的 Expanded 小部件来占用空间..

class TestWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Text('bob'),
          Expanded(
            child: Column(children: [
              Text('bob2'),
            ]),
          ),
        ],
      ),
    );
  }
}

我只是想了解为什么父“根”列默认占用所有空间，但是当我删除扩展小部件时，嵌套列没有？

一定很简单，但是当我浏览文档并理解时，我没有看到它。

非常感谢您的帮助。

标签： dartflutter

解决方案

这是 Flutter 应用于根小部件的布局约束。

推荐阅读