This component is designed for implementing pagination in Flutter.

OpenAI Logo

Getting started

This package requires you to provide the current page number, total number of pages, and the function responsible for fetching data on a per-page basis, you can add other properties like colors, padding, font size, width and others.

Example

import 'package:flutter/material.dart';

import 'components/custom_pagination.dart';

class PaginationExample extends StatefulWidget {
  PaginationExample({Key? key}) : super(key: key);

  @override
  State<PaginationExample> createState() => _PaginationExampleState();
}

class _PaginationExampleState extends State<PaginationExample> {
  int currentPage = 1;
  int totalPages = 100;
  List<int> middlePages = [];
  
  @override
  Widget build(BuildContext context) {
    return SizedBox(
        height: 40,
        width: MediaQuery.of(context).size.width,
        child: PaginationView(
          totalPages: totalPages,
          currentPage: currentPage,
          getData: (returnCurrentPage,
              returnedMiddlePages) async {
            currentPage = returnCurrentPage;
            middlePages = returnedMiddlePages;
            await getPageData(currentPage);
          },
        ));
  }

  Future<void> getPageData(int currentPage) async {
    // fetch data
  }
}

Follow me in LinkedIn

https://www.linkedin.com/in/walidbarakat1985/