I am using ListView.builder to display results in my app, which is optimized for phones. Currently I'm trying to optimize for tablet views.
My designer wants to create a "grid view" for the results. Basically there would be two columns. The results would alternate between the columns.
I'm not entirely sure how to do this with my listview.builder. Can someone point me in the right direction?
Here's what my code looks like currently.
Widget buildList(SearchBloc _searchBloc, BuildContext context) {
// Build a list view based off the _searchBloc.results stream
return StreamBuilder(
stream: _searchBloc.results,
builder: (context, AsyncSnapshot<Map<int, BibSearchRowModel>> snapshot) {
// If we don't have anything yet, show a loading indicator.
if (!snapshot.hasData) {
return Center(
child: LoadingIndicator(),
);
}
// If we do have some data, show the list view.
return ListView.builder(
itemCount: _searchBloc.queryModel.totalNumResults,
itemBuilder: (context, int index) {
// API returns paginated results. Once we run out of results on the current "page" we need to request more.
if (!snapshot.data.containsKey(index)) {
_searchBloc.getResults();
return Placeholder();
}
// Display the actual result if we have the data for it.
return ListTile(
title: SearchResultItem(
resultData: snapshot.data[index],
searchQuery: _searchBloc.queryModel.searchQuery,
),
);
},
);
},
);
So the issue is that I can't create to ListTile's at the same time. I need to use a ListView.builder so I can automatically fetch more results when we get to the end of what's loaded.
Suggestions?