components/paginations/flutstrap_pagination library Components Navigation

Flutstrap Pagination

A high-performance, customizable pagination component with Bootstrap-inspired styling, optimized for large datasets and smooth user interactions.

Usage Examples

// Basic pagination with callback
FlutstrapPagination(
  currentPage: currentPage,
  totalPages: totalPages,
  onPageChanged: (page) => setState(() => currentPage = page),
)

// Advanced pagination with items count
FlutstrapPagination(
  currentPage: page,
  totalPages: 42,
  totalItems: 420,
  itemsPerPage: 10,
  showItemsCount: true,
  showFirstLast: true,
  variant: FSPaginationVariant.primary,
  onPageChanged: (page) => api.fetchPage(page),
)

// Compact pagination for mobile
FlutstrapPagination(
  currentPage: currentPage,
  totalPages: totalPages,
  size: FSPaginationSize.sm,
  maxVisiblePages: 5,
  onPageChanged: (page) => navigateToPage(page),
)

Accessibility

  • Full screen reader support with proper semantic labels
  • Keyboard navigation support for all pagination controls
  • Clear visual indicators for current page and disabled states
  • Proper ARIA attributes for pagination landmarks

Usage Examples

// Basic pagination with callback
FlutstrapPagination(
  currentPage: currentPage,
  totalPages: totalPages,
  onPageChanged: (page) => setState(() => currentPage = page),
)

// Advanced pagination with items count
FlutstrapPagination(
  currentPage: page,
  totalPages: 42,
  totalItems: 420,
  itemsPerPage: 10,
  showItemsCount: true,
  showFirstLast: true,
  variant: FSPaginationVariant.primary,
  onPageChanged: (page) => api.fetchPage(page),
)

// Compact pagination for mobile
FlutstrapPagination(
  currentPage: currentPage,
  totalPages: totalPages,
  size: FSPaginationSize.sm,
  maxVisiblePages: 5,
  onPageChanged: (page) => navigateToPage(page),
)

Accessibility

  • Full screen reader support with proper semantic labels
  • Keyboard navigation support for all pagination controls
  • Clear visual indicators for current page and disabled states
  • Proper ARIA attributes for pagination landmarks

Classes

FlutstrapPagination
Flutstrap Pagination
FSPaginationConfig
Flutstrap Pagination Configuration

Enums

FSPaginationAlignment
Flutstrap Pagination Alignment
FSPaginationSize
Flutstrap Pagination Size
FSPaginationVariant
Flutstrap Pagination Variants