EdsonBueno / infinite_scroll_pagination

Flutter package to help you lazily load and display pages of items as the user scrolls down your screen.
https://pub.dev/packages/infinite_scroll_pagination
MIT License
623 stars 210 forks source link

Mulitple levels #190

Closed tas-unn closed 1 year ago

tas-unn commented 2 years ago

I have a file with this structure: https://jsoneditoronline.org/#left=cloud.5c3ee044771a4f25ab22407409e0da1b (number of items in "listlevel1" may vary and reach up to 2000) How can I make sure that my list loads correctly as I go down? I have now done that it is loaded by 20 elements, but the whole list at once

`

class _State extends State<ShownSp> {
static const _pageSize = 20;
bool islast = false;
PagingController<int, Abit> _pagingController =
    PagingController(firstPageKey: 0);
List<Abit> abs = List.empty();

@override
void initState() {
    _pagingController.addPageRequestListener((pageKey) {
    _fetchPage(pageKey);
    });
    super.initState();

}

void dispose() {
    _pagingController.dispose();
    super.dispose();
}

Future<void> _fetchPage(int pageKey) async {

try {
  final List<Abit> newItems = List.empty(growable: true);

  if (abs.length != 0) {
    int min = 0;
    if (_pageSize < abs.length - pageKey * _pageSize)
      min = _pageSize;
    else
      min = abs.length - pageKey * _pageSize;

    for (var i = 0; i < min; i++) {

      newItems.add(abs[pageKey * _pageSize + i]);
    }
    islast = true;
  }
  final isLastPage = newItems.length < _pageSize;
  if (isLastPage && islast) {

    _pagingController.appendLastPage(newItems);
  } else {
    final nextPageKey = pageKey + 1;

    _pagingController.appendPage(newItems, nextPageKey);
  }
} catch (error) {
  _pagingController.error = error;
  print(error);
}
}

........

ListView.builder(
                    physics: NeverScrollableScrollPhysics(),
                    shrinkWrap: true,
                    itemCount: mydata.dinlist.length,
                    itemBuilder: (BuildContext context, int index) {
                      abs = mydata.dinlist[index].abit;

                      islast = false;
                      _pagingController = PagingController(firstPageKey: 0);
                      _pagingController.addPageRequestListener((pageKey) {
                        _fetchPage(pageKey);
                      });
                      return Column(
                        children: [
                          Container(
                            color: Color.fromRGBO(216, 249, 170, 1),
                            child: ListTile(
                              title: Text(
                                  mydata.dinlist[index].name + txtkolmest),
                            ),
                          ),
                          PagedListView<int, dynamic>(
                            physics: NeverScrollableScrollPhysics(),
                            shrinkWrap: true,
                            pagingController: _pagingController,
                            builderDelegate:
                                PagedChildBuilderDelegate<dynamic>(
                                    itemBuilder: (BuildContext context1,
                                        item, int index1) {
                              Abit a = item;
                              islast=true;
return (Text(a.fio))

}}}}

`

clragon commented 1 year ago

You should not be using NeverScrollableScrollPhysics nor shrinkWrap for ListViews. That is essentially just a Column. Additionally, PagedListView only works correctly when not shrinkWrapped. To avoid the sizing error use a Expanded around it when inside a Column.

notsag-dev commented 10 months ago

Guys, I was also shrink-wrapping the list and basically the new page event was being fired for all pages consecutively without scrolling. I was doing it to include this list on a Profile section feed of a social network. It has the user info on top then the infinite scroll, like an Instagram feed, where the profile scrolls like it was part of the list.

Apparently normally this would be done with a NestedScrollView in Flutter, but for lists that have their own controller like in this case, NestedScrollView doesn't work properly, the scrolling experience is a bit broken.

So I wanted to know, is it possible to implement this behavior when using infinite scroll pagination in a PagedListView?

Thank you for any help and for library too, very useful.

notsag-dev commented 10 months ago

Sorry, for the record, I was confused between PagingController and ScrollController. This list has its own PagingController, the infinite scroll pagination controller, but not its own ScrollingController, which makes it compatible with the NestedScrollView. In my case the issue was that the infinite scrolling list had to have primary: true and I'd had set it to false while trying other stuff.