Flutter:是否可以仅滚动ExpansionPanelRadio body:内的项目?

ql3eal8s  于 2022-11-25  发布在  Flutter
关注(0)|答案(1)|浏览(111)

我是一个新的Flutter,如果有人能给予我一些提示,我将不胜感激:我必须做一些(不是固定数量的)小部件,这些小部件必须是可扩展的。当扩展时,它们在它们的主体中包含小部件列表。列表很长,必须是可滚动的,以便看到所有的项目。
如果我把所有的东西(整个可扩展的小部件)放在SingleChildScrollView内,那么列表中的条目在正文中是可滚动的,但标题也是可滚动的--我应该阻止它。

Widget _buildPanel() {
    return SingleChildScrollView(
        child: ExpansionPanelList.radio(
      children: _data.map<ExpansionPanelRadio>((Item item) {
        return ExpansionPanelRadio(
            value: item.id,
            headerBuilder: (BuildContext context, bool isExpanded) {
              return Padding(
                  padding: const EdgeInsets.only(top: 60.0),
                  child: Row(
                    children: [
                      SvgPicture.network(
                          "https://some_picture.svg",
                          height: 80),
                      Column(children: <Widget>[
                        Text(' Some Text'),
                        Text(' label '), 
                      ]),
                    ],
                  ));
            },
            body: ListView.builder(
              itemCount: widgets.length,
              itemBuilder: (context, index) => ListTile(title: widgets[index]),
              scrollDirection: Axis.vertical,
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
            ));
      }).toList(),
    ));
  }

如果我像这样只把body放在SingleChildScrollView里面,就会得到异常。

Widget _buildPanel() {
    return ExpansionPanelList.radio(
      children: _data.map<ExpansionPanelRadio>((Item item) {
        return ExpansionPanelRadio(
            value: item.id,
            headerBuilder: (BuildContext context, bool isExpanded) {
              return Padding(
                  padding: const EdgeInsets.only(top: 60.0),
                  child: Row(
                    children: [
                      SvgPicture.network("https://some_picture.svg",
                          height: 80),
                      Column(children: <Widget>[
                        Text(' Some Text'),
                        Text(' label '),
                      ]),
                    ],
                  ));
            },
            body: SingleChildScrollView(
                child: ListView.builder(
              itemCount: widgets.length,
              itemBuilder: (context, index) => ListTile(title: widgets[index]),
              scrollDirection: Axis.vertical,
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
            )));
      }).toList(),
    );
  }

是否可以只滚动列表项并将标题保持在固定位置?

lo8azlld

lo8azlld1#

你需要为你的body设置height,并删除physicsshrinkWrap,以得到你想要的,如下所示:

body: SizedBox(
  height: 300,//<-- add this
  child: ListView.builder(
    itemCount: widgets.length,
    itemBuilder: (context, index) =>
        ListTile(title: widgets[index]),
    scrollDirection: Axis.vertical,
  ),
),

相关问题