在此示例中,我想创建由ItemData参数List填充的ListViewTiles的ListView。我想将标题Image作为同一ListView的顶部小部件放置。图片必须与列表标题的其余部分一起滚动。
Widget _buildListViewWithHeader(BuildContext context, Image banner, List<ItemData> items) {
return ListView.builder(
itemBuilder: (context, index) {
return ListTile(
leading: items[index].leading,
title: items[index].title,
trailing: items[index].trailing,
);
},
);
}
如何将图像放置在this ListView的顶部?
是否存在将小部件列表传递到listView并将其放置在项目生成器生成的小部件之前的通用方法?
您可以在itemBuilder的第一个索引上返回标头,类似于:
Widget _buildListViewWithHeader(BuildContext context, Image banner, List<ItemData> items) {
return ListView.builder(
itemCount: items == null ? 1 : items.length + 1,
itemBuilder: (context, index) {
if (index == 0) {
// return the header
return Image.asset(...);
}
index -= 1;
return ListTile(
leading: items[index].leading,
title: items[index].title,
trailing: items[index].trailing,
);
},
);
}
希望有帮助!
这里是一种注入更多数量的小部件的更通用的方法:
Widget _buildListViewWithHeader(BuildContext context, List<Widget> topWidgets, List<ItemData> itemData) {
return ListView.builder(
itemCount: topWidgets.length + itemData.length,
itemBuilder: (context, index) {
if (index < topWidgets.length) {//<-- returns each injected widget in list.
return topWidgets[index];
}
int itemIndex = index - topWidgets.length; //<-- subtract the number of widgets injected.
return ListTile(
leading: itemData[itemIndex].leading,
title: itemData[itemIndex].title,
trailing: itemData[itemIndex].trailing,
);
},
);