无法在 Flutter 中滚动 ListView答案

【问题标题】：Unable to scroll ListView in Flutter无法在 Flutter 中滚动 ListView
【发布时间】：2020-11-19 07:20:37
【问题描述】：

我是 Flutter 的新手，目前正在做一个需要可滚动列的项目。所以我使用了ListView。 CollapseTile 是一个重构的小部件。

代码如下：

Widget build(BuildContext context) {
    return Scaffold(
        body: Column(
          children: <Widget>[
            ListView(
                scrollDirection: Axis.vertical,
                shrinkWrap: true,
                children: <Widget>[
                  SizedBox(height: 20.0),
                  CollapseTile(
                    text: 'Skin',
                    children: <Widget>[
                      ListView.builder(
                          shrinkWrap: true,
                          physics: AlwaysScrollableScrollPhysics(),
                          itemCount: data['skin'].length,
                          itemBuilder: (BuildContext context, int index) {
                            print(_selectedSkin);
                            return CheckboxListTile(
                              title: Text(data['skin'][index]['name']),
                              value: _selectedSkin
                                  .contains(data['skin'][index]['name']),
                              secondary: Image(
                                image: AssetImage(
                                    'images/${skinImageName[index]}'),
                              ),
                              onChanged: (bool selected) {
                                _onSelected(
                                    selected, data['skin'][index]['name']);
                              },
                            );
                          })
                    ],
                  ),
                  CollapseTile(
                    text: 'Teeth',
                    children: <Widget>[],
                  ),
                  CollapseTile(
                    text: 'Mouth',
                    children: <Widget>[],
                  ),
                  CollapseTile(
                    text: 'Eye',
                    children: <Widget>[],
                  ),
                  CollapseTile(
                    text: 'Hair',
                    children: <Widget>[],
                  ),
                  CollapseTile(
                    text: 'Nails',
                    children: <Widget>[],
                  ),
                ],
              ),
            ),
          ],
        );
  }

但是，ListView 不滚动，RenderFlex 溢出。

【问题讨论】：

请附上截图

标签： flutter listview dart flutter-widget

【解决方案1】：

在ListView 中添加SingleChildScrollView 并添加物理为NeverScrollableScrollPhysics。

 Scaffold(
  body: SingleChildScrollView( 
    child: Column(
      children: <Widget>[
    ListView(
    scrollDirection: Axis.vertical,
      physics: NeverScrollableScrollPhysics(),
      shrinkWrap: true,
      children: <Widget>[
        SizedBox(height: 20.0),
        CollapseTile(
          text: 'Skin',
          children: <Widget>[
            ListView.builder(
                shrinkWrap: true,
                physics: NeverScrollableScrollPhysics(),
                itemCount: data['skin'].length,
                itemBuilder: (BuildContext context, int index) {
                  print(_selectedSkin);
                  return CheckboxListTile(
                    title: Text(data['skin'][index]['name']),
                    value: _selectedSkin
                        .contains(data['skin'][index]['name']),
                    secondary: Image(
                      image: AssetImage(
                          'images/${skinImageName[index]}'),
                    ),
                    onChanged: (bool selected) {
                      _onSelected(
                          selected, data['skin'][index]['name']);
                    },
                  );
                })
          ],
        ),
        CollapseTile(
          text: 'Teeth',
          children: <Widget>[],
        ),
        CollapseTile(
          text: 'Mouth',
          children: <Widget>[],
        ),
        CollapseTile(
          text: 'Eye',
          children: <Widget>[],
        ),
        CollapseTile(
          text: 'Hair',
          children: <Widget>[],
        ),
        CollapseTile(
          text: 'Nails',
          children: <Widget>[],
        ),
      ],
    ),
),
  ),
],
);

【讨论】：