Pagination and Infinite Scroll in Flutter

import 'package:flutter/foundation.dart';

class PagedList<T> extends ChangeNotifier {
  PagedList(this._fetchPage, {this.pageSize = 20});

  final Future<List<T>> Function(int page, int pageSize) _fetchPage;
  final int pageSize;

  final List<T> items = [];
  bool loading = false;
  bool hasMore = true;
  String? error;
  int _page = 1;

  Future<void> loadMore() async {
    if (loading || !hasMore) return; // guard against duplicate requests

    loading = true;
    error = null;
    notifyListeners();

    try {
      final page = await _fetchPage(_page, pageSize);
      items.addAll(page);
      _page++;
      if (page.length < pageSize) hasMore = false; // a short page means the end
    } catch (e) {
      error = 'Could not load more items';
    } finally {
      loading = false;
      notifyListeners();
    }
  }

  Future<void> refresh() async {
    items.clear();
    _page = 1;
    hasMore = true;
    await loadMore();
  }
}

// Not standalone: paste the PagedList class from above into the same file.
import 'package:flutter/material.dart';

Future<List<String>> fakeFetch(int page, int pageSize) async {
  await Future<void>.delayed(const Duration(seconds: 1));
  if (page > 5) return []; // five pages in total
  return List.generate(pageSize, (i) => 'Item ${(page - 1) * pageSize + i + 1}');
}

void main() => runApp(const MaterialApp(home: FeedPage()));

class FeedPage extends StatefulWidget {
  const FeedPage({super.key});

  @override
  State<FeedPage> createState() => _FeedPageState();
}

class _FeedPageState extends State<FeedPage> {
  final _list = PagedList<String>(fakeFetch);

  @override
  void initState() {
    super.initState();
    _list.loadMore();
  }

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Feed')),
      body: ListenableBuilder(
        listenable: _list,
        builder: (context, child) {
          final items = _list.items;

          if (items.isEmpty && _list.loading) {
            return const Center(child: CircularProgressIndicator());
          }

          return RefreshIndicator(
            onRefresh: _list.refresh,
            child: ListView.builder(
              itemCount: items.length + 1, // one extra row for the footer
              itemBuilder: (context, index) {
                if (index < items.length) {
                  return ListTile(title: Text(items[index]));
                }
                return _Footer(list: _list);
              },
            ),
          );
        },
      ),
    );
  }
}

class _Footer extends StatelessWidget {
  const _Footer({required this.list});
  final PagedList<String> list;

  @override
  Widget build(BuildContext context) {
    if (list.error != null) {
      return Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          children: [
            Text(list.error!),
            TextButton(onPressed: list.loadMore, child: const Text('Try again')),
          ],
        ),
      );
    }
    if (!list.hasMore) {
      return const Padding(
        padding: EdgeInsets.all(24),
        child: Center(child: Text('You have reached the end')),
      );
    }
    // Reaching this row means the user is at the bottom: load the next page.
    WidgetsBinding.instance.addPostFrameCallback((_) => list.loadMore());
    return const Padding(
      padding: EdgeInsets.all(24),
      child: Center(child: CircularProgressIndicator()),
    );
  }
}

final _controller = ScrollController();

@override
void initState() {
  super.initState();
  _controller.addListener(() {
    final position = _controller.position;
    if (position.pixels >= position.maxScrollExtent - 400) {
      _list.loadMore(); // within 400 pixels of the bottom
    }
  });
}

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

// ListView.builder(controller: _controller, ...)