Using in ListView

[gtilson]

Is it possible to use this widget inside a ListView? It seems that all elements are loaded when I put it in a ListView.

[vedartm]

Yes, it can be used inside ListView. This widget is similar to ListView and has all the attributes inside ListView (like shrinkWrap and all). The process is similar to adding a list view inside a list view.

[vedartm]

I hope it answered your question. Feel free reopen this issue if you face any related issue. 🥂

[gtilson]

I know that it can be used inside ListView; however, when it is used inside ListView everything is loaded upon build.

buildProfilePosts() { return PaginateFirestore( itemsPerPage: 7, shrinkWrap: true, initialLoader: circularProgress(), itemBuilder: (context, documentSnapshot) => PostTile(Post.fromDocument(documentSnapshot)), query: postsRef .document(widget.profileId) .collection('userPosts') .orderBy('timestamp', descending: true), ); }

` @override Widget build(BuildContext context) {

return Scaffold(
  appBar: AppBar(
    backgroundColor: Theme.of(context).scaffoldBackgroundColor,
    bottomOpacity: 0,
    elevation: 0,
    title: Text(widget.profileId)
  ),
  body: Scrollbar( child:
    ListView(
    children: <Widget>[
      buildProfileHeader(),
      buildProfilePosts()
    ],
  ),
  ),
);

} }`

[vedartm]

When you add this widget inside a listview it is not paginating (or lazy loading) it is directly loading all the list is what you are saying right?

In that case, this happens for the first 2 pages at least. Lets consider you have list of 100 items and 10 is the page size. When you put it in a list view it loads 2 or 3 pages (i.e 30 items) before hand but it still paginates after the 2nd or 3rd page. This happens because next page is fetched only when the last item of previous page is built and the outer listview forces it load items before hand.

[vedartm]

@gtilson I use this as a solution. Instead of using an outer list view, I use preload items and put buildProfileHeader() if the item is null. For example

      PaginationView(
        preloadedItems: [null],
        itemBuilder: (_, idea) => (idea == null)
            ? buildProfileHeader()
            : buildListItem(),
        pageFetch: (offset) => // necessary query ,
        onError: (error) => // error widget,
      )

[mohdtaha60]

@gtilson I use this as a solution. Instead of using an outer list view, I use preload items and put buildProfileHeader() if the item is null. For example

      PaginationView(
        preloadedItems: [null],
        itemBuilder: (_, idea) => (idea == null)
            ? buildProfileHeader()
            : buildListItem(),
        pageFetch: (offset) => // necessary query ,
        onError: (error) => // error widget,
      )

How to Preload in PaginateFirestore?

[vedartm]

In the latest version (v0.2.2) header and footer support has been added. Now you can simply pass buildProfileHeader() in header attribute

[vedartm]

@mohdtaha60 preloadedItems attribute is basically list of objects that you already have locally instead of fetching it from firestore. You just have to pass a list of objects in preloadedItems