Flutter如何实现整页可滚动且内部元素高度保持动态

你的方案失效核心是Expanded组件的特性：它只能在高度确定的父容器（比如固定高度的Container、默认占满全屏的Scaffold body）中才能正常工作，用来分配剩余空间。当你给外层套SingleChildScrollView后，Column的父容器高度变成无限大，Expanded找不到可分配的固定高度，就会触发布局异常，自然没法达到预期效果。

你需要把原来的Column换成ListView，同时对原来两个用Expanded包裹的滚动组件做调整：

• 移除外层的Expanded包裹
• 给内部自带滚动能力的组件（比如ListView/GridView等）新增两个属性：physics: NeverScrollableScrollPhysics()（禁用自身滚动，交给外层ListView处理），shrinkWrap: true（让组件自身高度适配内容总高度，不再撑满父容器剩余空间）

修改后的参考代码如下：

Scaffold(
  // 直接将body替换为ListView，无需套SingleChildScrollView+Column
  body: ListView(
    children: <Widget>[
      Text(),
      IntrinsicHeight(
        child: Text(),
      ),
      Divider(height: 0.1),
      Text(),
      // 第一个原Expanded包裹的组件
      // 假设内部是ListView，其他滚动类组件配置逻辑一致
      ListView(
        physics: NeverScrollableScrollPhysics(), // 禁用自身滚动
        shrinkWrap: true, // 高度自适应内容总大小
        children: [
          // 你的原Expanded内的子元素
          Text()
        ],
      ),
      // 第二个原Expanded包裹的组件同理
      ListView(
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        children: [
          Text()
        ],
      ),
    ],
  ),
)

• 如果原来Expanded里包裹的是GridView、CustomScrollView这类其他滚动组件，同样加上面两个属性即可
• 如果内部是静态文本、图片这类本身不带滚动能力的组件，直接放在外层ListView的children里即可，无需额外配置

内容的提问来源于stack exchange，提问作者BradG