恐怕这是我们用ListView.separated所能得到的最干净的了

ListView.separated(
  separatorBuilder: (context, index) => const Divider(height: 1.0,),
  itemCount: 2 + boardList.length,
  itemBuilder: (context, index) {
    if (index == 0 || index == boardList.length + 1) return const SizedBox.shrink();
    return MenuItem(
      board: boardList[index - 1], 
      isSelected: boardList[index].id == selectedBoardId
    );
  },
);

另一种方法是使用ListView.builder并将项目 Package 为带有边框底部的container

ListView.builder(
  itemCount: boardList.length,
  itemBuilder: (context, index) {
    return Container(
      decoration: BoxDecoration(
        color: (widget.isSelected) ? Colors.grey[50] : color,
        border: Border(
          top: (index == 0) ? BorderSide(color: Theme.of(context).dividerColor) : BorderSide.none
          bottom: BorderSide(color: Theme.of(context).dividerColor)
          
        )
      )
    ),
  },
);

你可以把你的ListView.serarated Package 在另一个ListView中，然后把你的分隔符放在ListView.separated的前面和后面。但是你需要定义scrollDirection和shrinkWrap，如示例所示。否则，你会得到一个错误，为unbounded hight。作为分隔符，我使用了Divider-Widget，但你可以使用任何你想要的。

ListView(
        children: <Widget>[
          Divider(),
          ListView.separated(
            scrollDirection: Axis.vertical,
            shrinkWrap: true,
            itemBuilder: // ...
            separatorBuilder: // ...
            itemCount: // ...
          ),
          Divider(),
        ],
      ),

或者让itemBuilder返回一个Column，列表项位于两个条件分隔符之间。

ListView.separated(
  separatorBuilder: (context, index) => const Divider(),
  itemCount: list.length,
  itemBuilder: ((context, index) {
    return Column(
      children: [
        if (index == 0)
          const Divider(),
        ListItem(
          index: index,
        ),
        if (list.length == index + 1)
          const Divider()
      ],
    );
  }),
)