使用ListView.Builder创建列表时,如何在最后一项中隐藏分隔符?
为每个项目添加分隔符很容易,但是取消列表中最后一个项目的分隔符的逻辑是什么?
对于实现此任务的具体示例,没有具体的stackoverflow问题。
Widget build(BuildContext context) {
return
ListView.builder(
shrinkWrap: true,
physics: ScrollPhysics(),
itemCount: OffersList.length,
itemBuilder: (context, index) {
Offer item = OffersList[index];
return ListItem(context, item);
},
);
}
Widget ListItem(BuildContext context, Offer item) {
if ( index == OffersList.length - 1) {
dividerChecker = EmptyContainer();
} else {
dividerChecker = Divider();
}
return Column(
children: <Widget>[
OfferListItem(
offerData: item,
status: status,
userType: userType,
),
dividerChecker,
],
);
}
建议的解决方案:
使用ListView.separator代替ListView.Builder:
ListView.separated(
separatorBuilder: (BuildContext context, int index) => new Divider(),
shrinkWrap: true,
physics: ScrollPhysics(),
itemCount: OffersList.length,
itemBuilder: (context, index) {
Offer item = OffersList[index];
return offerListItem(context, item);
},
),
Widget offerListItem(BuildContext context, Offer item) {
return Column(
children: <Widget>[
OfferListItem(
offerData: item,
status: status,
userType: userType,
),
],
);
}
答案 0 :(得分:2)
使用ListView.separated()
答案 1 :(得分:0)
您可以将ListView.separated()
用于动态创建的列表,或将ListTile.divideTiles用于简短的静态列表。这两种方法都没有在最后一个列表项之后添加分隔符。
ListView(
children: ListTile.divideTiles( // <-- ListTile.divideTiles
context: context,
tiles: [
ListTile(
title: Text('Horse'),
),
ListTile(
title: Text('Cow'),
),
ListTile(
title: Text('Camel'),
),
ListTile(
title: Text('Sheep'),
),
ListTile(
title: Text('Goat'),
),
]
).toList(),
)
ListView.separated(
itemCount: 100,
itemBuilder: (context, index) {
return ListTile(
title: Text('$index sheep'),
);
},
separatorBuilder: (context, index) {
return Divider();
},
)
这将为每个项目返回两个小部件,最后一个项目除外。 separatorBuilder
用于添加分隔符。
如果您确实想要在最后一项之后添加分隔线,请参阅我的fuller answer。