vm_page_numbers 1.0.0+2 copy "vm_page_numbers: ^1.0.0+2" to clipboard
vm_page_numbers: ^1.0.0+2 copied to clipboard

A customizable Flutter pagination widget that automatically adapts to available space, providing an intuitive and responsive page navigation interface.

VmPageNumbers #

A highly customizable Flutter widget for pagination that provides an elegant and responsive page number navigation interface.

Features #

  • Responsive layout that automatically adapts to available width
  • Customizable appearance for all elements (numbers, navigation buttons, separators)
  • Smart pagination algorithm that maintains context around the current page
  • Support for keyboard navigation
  • Material Design 3 default theme
  • Highly performant custom render object implementation

Installation #

Add this to your package's pubspec.yaml file:

dependencies:
  vm_page_numbers: ^2.1.2

Usage #

VmPageNumbers(
  currentPage: 5,
  totalPages: 20,
  onPageSelected: (page) {
    setState(() => _currentPage = page);
  },
)

Customization #

You can customize the appearance of all elements:

VmPageNumbers(
  currentPage: currentPage,
  totalPages: totalPages,
  onPageSelected: onPageSelected,
  numberButtonBuilder: (context, page, isCurrent) {
    return CustomButton(
      page: page,
      isSelected: isCurrent,
    );
  },
  previousButtonBuilder: (context, isEnabled, onPressed) {
    return CustomNavButton(
      icon: Icons.chevron_left,
      onPressed: isEnabled ? onPressed : null,
    );
  },
  nextButtonBuilder: (context, isEnabled, onPressed) {
    return CustomNavButton(
      icon: Icons.chevron_right,
      onPressed: isEnabled ? onPressed : null,
    );
  },
  separatorBuilder: (context) {
    return const Text('•••');
  },
  navNumberSpacing: 16.0,
  numberNumberSpacing: 8.0,
)

Properties #

  • currentPage: The current active page (1-based indexing)
  • totalPages: Total number of pages
  • onPageSelected: Callback when a page number is selected
  • onPreviousPage: Optional callback for custom previous page navigation
  • onNextPage: Optional callback for custom next page navigation
  • numberButtonBuilder: Builder for page number buttons
  • previousButtonBuilder: Builder for the previous page button
  • nextButtonBuilder: Builder for the next page button
  • separatorBuilder: Builder for separator (ellipsis) elements
  • navNumberSpacing: Spacing between navigation buttons and number buttons
  • numberNumberSpacing: Spacing between number buttons

Examples #

See the example folder for a complete sample application.

License #

This project is licensed under the MIT License - see the LICENSE file for details.

2
likes
160
points
4
downloads
screenshot

Publisher

unverified uploader

Weekly Downloads

A customizable Flutter pagination widget that automatically adapts to available space, providing an intuitive and responsive page navigation interface.

Repository (GitLab)
View/report issues

Topics

#pagination #navigation #ui #widget

Documentation

API reference

Funding

Consider supporting this project:

gitlab.com

License

MIT (license)

Dependencies

flutter

More

Packages that depend on vm_page_numbers