Flutter中Column元素无法滚动问题求助（附代码）

问题原因 #

你当前的代码里，外层用SingleChildScrollView包裹Column，但内部嵌套了ListView.builder——即使设置了shrinkWrap: true，ListView默认依然会自带滚动特性，这会和外层的滚动组件产生冲突，导致整个页面无法正常滚动。

解决方案 #

方案1：移除冗余的外层滚动组件（推荐） #

既然页面核心内容就是列表，直接用ListView.builder作为页面主体即可，不需要额外套SingleChildScrollView和Column，这样既简洁又能保证正常滚动：

Padding(
  padding: EdgeInsets.only(left: 16.0, right: 16.0),
  child: FutureBuilder(
    future: getAppointments(email),
    builder: (context, AsyncSnapshot snapshot) {
      if (snapshot.hasData) {
        return ListView.builder(
          itemCount: snapshot.data.length,
          itemBuilder: (_, index) {
            AppointmentsUser appointments = snapshot.data[index];
            return Column(children: <Widget>[
              ListTile(
                title: Text(
                  appointments.service,
                  style: TextStyle(fontSize: 20),
                ),
                leading: Icon(Icons.people),
              ),
              ListTile(title: Text("Seller: ${appointments.seller}")),
              ListTile(title: Text("Date: ${appointments.date}")),
              ListTile(title: Text("Time: ${appointments.time}")),
              Divider(),
            ]);
          },
        );
      }
      return CircularProgressIndicator.adaptive();
    },
  ),
)

方案2：保留外层结构，禁用内部ListView的滚动 #

如果因为页面布局需求必须保留外层的SingleChildScrollView和Column，那需要给内部的ListView.builder添加physics: NeverScrollableScrollPhysics()，让它把滚动控制权交给外层组件，同时保留shrinkWrap: true让它自适应内容高度：

SingleChildScrollView(
  child: Column(
    children: [
      Padding(
        padding: EdgeInsets.only(left: 16.0, right: 16.0),
        child: FutureBuilder(
          future: getAppointments(email),
          builder: (context, AsyncSnapshot snapshot) {
            if (snapshot.hasData) {
              return ListView.builder(
                scrollDirection: Axis.vertical,
                shrinkWrap: true,
                physics: NeverScrollableScrollPhysics(), // 新增这一行
                itemCount: snapshot.data.length,
                itemBuilder: (_, index) {
                  AppointmentsUser appointments = snapshot.data[index];
                  return Column(children: <Widget>[
                    ListTile(
                      title: Text(
                        appointments.service,
                        style: TextStyle(fontSize: 20),
                      ),
                      leading: Icon(Icons.people),
                    ),
                    ListTile(title: Text("Seller: ${appointments.seller}")),
                    ListTile(title: Text("Date: ${appointments.date}")),
                    ListTile(title: Text("Time: ${appointments.time}")),
                    Divider(),
                  ]);
                },
              );
            }
            return CircularProgressIndicator.adaptive();
          },
        ),
      ),
    ],
  ),
)

内容的提问来源于stack exchange，提问作者Sarthak Kumar Mishra