如何在Flutter中实现ListView与其他组件的搭配使用？

Flutter 中 ListView 默认会抢占父组件分配的全部可用空间，当它被放在无垂直边界约束的父组件（如 Column、SingleChildScrollView）内时，垂直方向约束为无限大，ListView 会尝试占满无限高度，最终导致后续组件被挤出可视区域，甚至直接触发布局异常。

• 方案1：开启 ListView 自适应高度，适用于需要整个页面（含列表、按钮）一起滚动的场景
  给 ListView 加上 shrinkWrap: true 让它仅占用内容实际需要的高度，同时关闭自身滚动功能避免和外层 SingleChildScrollView 滚动冲突，代码示例如下：

Scaffold(   
  body: SingleChildScrollView(
    child: Column(
      children: <Widget>[
        ListView.builder(
          shrinkWrap: true,
          physics: const NeverScrollableScrollPhysics(),
          // 以下替换为你自己的列表配置
          itemCount: 10,
          itemBuilder: (context, index) {
            return ListTile(title: Text("第$index项"));
          }
        ),
        RaisedButton(
          child: const Text('Text'),
          onPressed:(){}
        )
      ],
    )
  )
);

• 方案2：用 Expanded 包裹 ListView，适用于仅列表区域滚动、其余组件固定在页面对应位置的场景
  Expanded 会让 ListView 占用 Column 内除其他固定组件外的全部剩余空间，不需要外层加 SingleChildScrollView，代码示例如下：

Scaffold(   
  body: Column(
    children: <Widget>[
      Expanded(
        child: ListView.builder(
          // 以下替换为你自己的列表配置
          itemCount: 10,
          itemBuilder: (context, index) {
            return ListTile(title: Text("第$index项"));
          }
        ),
      ),
      RaisedButton(
        child: const Text('Text'),
        onPressed:(){}
      )
    ],
  )
);

• 方案3：给 ListView 设置固定高度，适用于列表区域高度固定的场景
  用 SizedBox 或者 Container 包裹 ListView 并指定明确的 height 属性即可，代码示例如下：

Scaffold(   
  body: SingleChildScrollView(
    child: Column(
      children: <Widget>[
        SizedBox(
          height: 300,
          child: ListView.builder(
            // 以下替换为你自己的列表配置
            itemCount: 10,
            itemBuilder: (context, index) {
              return ListTile(title: Text("第$index项"));
            }
          ),
        ),
        RaisedButton(
          child: const Text('Text'),
          onPressed:(){}
        )
      ],
    )
  )
);

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