我有一个2/3列的gridview,当用户滚动到末尾时,我想在网格的底部中心显示一个加载指示器。将加载指示器添加为网格的最后一个元素看起来并不好,因为它没有居中。这可能吗?
代码段:
GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2, childAspectRatio: 480 / 315),
controller: controller,
itemCount: videos.length + 1,
itemBuilder: (context, index) {
if (index == videos.length) {
//show loading indicator at last index
return SpinKitThreeBounce(
color: Colors.white,
size: 35.0,
);
}
return VideoItem(video: videos[index]);
},
);
我所拥有的:
我想要什么:
答案 0 :(得分:5)
使用CustomScrollView
也应该可行。
https://api.flutter.dev/flutter/widgets/CustomScrollView-class.html
在此内部,您可以同时使用SliverGrid
和SliverList
来创建布局。
这样,您可以将微调框放在SliverList
中,并在SliverGrid
更新时将其隐藏。
黄色的椭圆形是旋转器。
这是我使用的代码:
return CustomScrollView(
slivers: <Widget>[
SliverGrid(
gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
maxCrossAxisExtent: 200.0,
mainAxisSpacing: 5.0,
crossAxisSpacing: 10.0,
childAspectRatio: 1.0,
),
delegate: SliverChildBuilderDelegate(
(BuildContext context, int index) {
return Product(
product_name: listItem[index]['name'],
product_pic: listItem[index]['pic'],
product_price: listItem[index]['price'],
product_old: listItem[index]['old_price'],
);
},
childCount: listItem.length
)
),
SliverList(
delegate: SliverChildBuilderDelegate(
(BuildContext context, int index) {
return SpinKitRotatingCircle(
color: Colors.amber,
size: 60.0,
);
},
childCount: 1,
),
)
],
);
您可以为旋转器行为实施不同的解决方案。