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
624 stars 211 forks source link

Not working when List is inside a column and SingleChlildScrollView #153

Closed carrasc0 closed 2 years ago

carrasc0 commented 2 years ago

I have been trying with a PagedGridView inside a SingleScrollView and with physics: NeverScrollableScrollPhysics(), but is not working at all. Any suggestions?

clragon commented 2 years ago

you can switch to the dev branch and use the new inbuilt paged staggered grid view

pratikbaid3 commented 2 years ago

@clragon I want to add a PagedListView inside a Column that is inside a SingleChildScrollView. Is there some way to achieve this.

clragon commented 2 years ago

in what way is such a layout desirable? nesting scrollviews is not a good idea.

PagedListView is already scrollable on its own.

EdsonBueno commented 2 years ago

@carrasc0 I can second what @clragon said. I'm closing the issue now due to inactivity, but please, let us know if you still need any help. Thanks again @clragon !

d3roch4 commented 1 year ago

I have this problem! I want a header for list

clragon commented 1 year ago

You can use the Sliver versions of the Paged widgets inside of a CustomScrollView. Your probably non-sliver header widget then has to be wrapped in a SliverToBoxAdapter.

d3roch4 commented 1 year ago

This work for me. Thanks!

Em qui., 30 de mar. de 2023 10:09, clragon @.***> escreveu:

You can use the Sliver versions of the Paged widgets inside of a CustomScrollView. Your probably non-sliver header widget then has to be wrapped in a SliverToBoxAdapter.

— Reply to this email directly, view it on GitHub https://github.com/EdsonBueno/infinite_scroll_pagination/issues/153#issuecomment-1490276991, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABNIODPMNZSNJJDSR2OZNRTW6WAYJANCNFSM5J3FJ5AA . You are receiving this because you commented.Message ID: @.***>

sikandernoori commented 1 year ago

Although this ticket is closes but I am adding sample code so whoever face this problem can try below and refactor accordingly:

import 'package:flutter/material.dart';
import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Pagination Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  static const int _pageSize = 20;
  final PagingController<int, Group> _pagingController =
      PagingController(firstPageKey: 0);

  final List<GroupInvite> _groupInvites = [
    GroupInvite(name: 'Group Invite 1'),
    GroupInvite(name: 'Group Invite 2'),
    GroupInvite(name: 'Group Invite 3'),
  ];

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

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

  Future<void> _fetchGroups(int pageKey) async {
    try {
      // Simulate fetching data from an API
      final List<Group> newGroups =
          await Future.delayed(const Duration(seconds: 2), () {
        return List.generate(_pageSize, (index) {
          final groupId = pageKey * _pageSize + index;
          return Group(id: groupId, name: 'Group $groupId');
        });
      });

      final isLastPage = newGroups.length < _pageSize;
      if (isLastPage) {
        _pagingController.appendLastPage(newGroups);
      } else {
        final nextPageKey = pageKey + 1;
        _pagingController.appendPage(newGroups, nextPageKey);
      }
    } catch (error) {
      _pagingController.error = error;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Pagination Demo'),
      ),
      body: CustomScrollView(
        slivers: [
          SliverToBoxAdapter(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const Padding(
                  padding: EdgeInsets.all(8.0),
                  child: Text(
                    'Group Invites',
                    style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
                  ),
                ),
                ListView.builder(
                  shrinkWrap: true,
                  physics: const NeverScrollableScrollPhysics(),
                  itemCount: _groupInvites.length,
                  itemBuilder: (context, index) {
                    final groupInvite = _groupInvites[index];
                    return ListTile(
                      title: Text(groupInvite.name),
                    );
                  },
                ),
                const Divider(),
                const Padding(
                  padding: EdgeInsets.all(8.0),
                  child: Text(
                    'Groups',
                    style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
                  ),
                ),
              ],
            ),
          ),
          PagedSliverList<int, Group>(
            pagingController: _pagingController,
            builderDelegate: PagedChildBuilderDelegate<Group>(
              itemBuilder: (context, group, index) {
                return ListTile(
                  title: Text(group.name),
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}

class GroupInvite {
  final String name;

  GroupInvite({required this.name});
}

class Group {
  final int id;
  final String name;

  Group({required this.id, required this.name});
}