如何在 ExpansionPanelList 中的标题之间添加间距？

Posted 2023-02-22

【中文标题】如何在 ExpansionPanelList 中的标题之间添加间距？

【英文标题】：How to add spacing between headers in an ExpansionPanelList?

【发布时间】：2020-01-06 01:23:43

【问题描述】：

我是 Flutter 的新手，并且对 Flutter 的造型方式有些挣扎（从没想过我会这么说，但我想念 css）。我制作了一个 ExpansionPanelList，我想在标题之间添加间距，以便我得到更像这样的东西：

而不是像这样 将所有标题压在一起

在此过程中，我还想在标题中添加一个框阴影（基本上，我希望它们看起来与第一张图像完全相同）。有没有简单的方法来实现这一点？

我尝试在标题构造函数中添加填充，但这只会使整个标题变大，并且没有在标题之间添加任何空间（回想起来这很有意义）。

这是我当前的代码（几乎只是一个样板列表）

Widget _buildPanel() 
    return ExpansionPanelList.radio(
      initialOpenPanelValue: null,
      expansionCallback: (int index, bool isExpanded)
        widget.store.toggleExpandable(index);
        if(widget.store.expandables.contains(true))
          if(!widget.store.fullView)
            ExpandNotification(expand: true)..dispatch(context);
            widget.store.toggleView();
          
        
        else
          if(widget.store.fullView)
            ExpandNotification(expand: false)..dispatch(context);
            widget.store.toggleView();
          
        

      ,
      children: _data.map<ExpansionPanelRadio>((Item item) 
        return ExpansionPanelRadio(
            value: item.id,
            canTapOnHeader: true,
            headerBuilder: (BuildContext context, bool isExpanded) 
              return ListTile(
                    title: Text(item.headerValue),
              );
            ,
            body: ListTile(
                title: Text(item.expandedValue),
                subtitle: Text('To delete this panel, tap the trash can icon'),
                trailing: Icon(Icons.delete),
                onTap: () 
                  setState(() 
                    _data.removeWhere((currentItem) => item == currentItem);
                  );
                ));
      ).toList(),
    );
  

提前致谢！

【问题讨论】：

嘿，@gollyzoom，你找到解决方案了吗，我仍然卡在这件事上。如果可以给我解决方案，那将非常有帮助。提前致谢

【参考方案1】：

在 headerBuilder 的返回中添加具有给定高度的 Divider()...