Number Paginator

pub.dev analysis

A Flutter paginator widget for switching between page numbers.

screenshot1 screenshot2 screenshot3

Getting Started

The number_paginator widget allows you to implement pagination with page numbers very easily. If you have a list that is split up into several pages, number_paginator can be used to let the user switch between these page numbers. The package automatically handles the case where page numbers don't fit on one screen and replaces some of them with three dots.

Usage

NumberPaginator only requires the number of pages (numberPages) to be set. All the rest is handled by the widget automatically. Normally, one also wants to react to page changes using the onPageChange callback.

NumberPaginator(
  numberPages: 10,
  onPageChange: (int index) {

    // handle page change...
  },
)

Customize

NumberPaginator allows for several customizations.

NumberPaginator(
  numberPages: 10,
  onPageChange: (int index) {
    setState(() {
      _currentPage = index;
    });
  },
  // initially selected index
  initialPage: 4,
  // default height is 48
  height: 70,
  buttonShape: BeveledRectangleBorder(
    borderRadius: BorderRadius.circular(8),
  ),
  buttonSelectedForegroundColor: Colors.yellow,
  buttonUnselectedForegroundColor: Colors.white,
  buttonUnselectedBackgroundColor: Colors.grey,
  buttonSelectedBackgroundColor: Colors.blueGrey,
)

screenshot4

Coming soon...

  • More customization options
  • Animations

Contribute

If you have any ideas for extending this package or have found a bug, please contribute!

  1. You'll need a GitHub account.
  2. Fork the number_paginator repository.
  3. Work on your feature/bug.
  4. Create a pull request.
  5. Star this project. ⭐
  6. Become a hero!! 🎉

Libraries

number_paginator