Flutter SilverList 分隔符/列表项之间的分隔符答案

【问题标题】：Flutter SilverList Separator / Divider between list itemsFlutter SilverList 分隔符/列表项之间的分隔符
【发布时间】：2019-08-29 17:27:28
【问题描述】：

使用 ListView.separated 我们可以在列表项之间添加 Divider()，但是，一旦我转换到 SliverList，我就看不到我的分隔符了。

delegate: SliverChildBuilderDelegate(
            // displays the index of the current item.
            (context, index) => new ListTile(
              title: Text(_sagItems[index].manufacturer, style: TextStyle(fontSize: 18),),
              subtitle: Text(_sagItems[index].model, style: TextStyle(fontSize: 16)),
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => DetailScreen(sagitem: _sagItems[index]),
                    ),
                  );
                },
              ),
              //DIVIDER NOT WORKING HERE
              Divider(color: Colors.blueGrey),
              childCount: _sagItems.length,
          ),

用 SliverList 添加分隔符的关键是什么？

【问题讨论】：

标签： listview flutter

【解决方案1】：

你可以这样做：

      delegate: SliverChildBuilderDelegate(
            (BuildContext context,int index){
              if(index.isOdd){
                return Divider(color: Colors.blueGrey);
              }
              return ListTile(
              title: Text(_sagItems[index~/2].manufacturer, style: TextStyle(fontSize: 18),),
              subtitle: Text(_sagItems[index~/2].model, style: TextStyle(fontSize: 16)),
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => DetailScreen(sagitem: _sagItems[index~/2]),
                    ),
                  );
                },
              );

              },
             childCount: (_sagItems.length * 2)-1,
          ),

【讨论】：

谢谢。这几乎对我有用，但是，它删除了我的奇怪列表项。我确实在这里看到了 childcount 的更新，但一定是遗漏了一些东西。
@jasonflaherty 我已经编辑了我的答案，只需将index 除以 2。它现在应该可以工作了。
有趣，我收到错误：_sagItems[index/2] - 参数类型“double”不能分配给参数类型“int”。
啊，好像用 Dart，你必须像这样使用截断除法：~/2 stackoverflow.com/a/20717065/350421
@jasonflaherty 是的，我没注意到。最近一直在编码很多cpp。无论如何，它现在工作了吗？

【解决方案2】：

我确信之前的答案工作正常，但我不喜欢额外的计算。它给代码带来了更多的复杂性，并且后来更难以维护。

相反，我建议您考虑将 ListTile 放在一个 Column 中，并且仅当您的索引到达最后一条记录时才隐藏 Divider。

delegate: SliverChildBuilderDelegate(
    // displays the index of the current item.
    (context, index) => Column(
      children: <Widget>[
        new ListTile(
          title: Text(
            _sagItems[index].manufacturer,
            style: TextStyle(fontSize: 18),
          ),
          subtitle: Text(_sagItems[index].model, style: TextStyle(fontSize: 16)),
          onTap: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => DetailScreen(sagitem: _sagItems[index]),
              ),
            );
          },
        ),
        index < _sagItems.length - 1 ? Divider(color: Colors.blueGrey) : Container(),
      ],
    ),
    childCount: _sagItems.length,
  ),

【讨论】：