SPagination class

Pagination component for Flutter.

Features

  • Page number buttons with automatic ellipsis (...) when there are many pages
  • Previous / Next navigation arrows
  • Jump-backward / Jump-forward (skip 5 pages) via ellipsis buttons
  • Simple mode - shows current / total input instead of page buttons
  • Size changer - dropdown to choose page size (10 / 20 / 50 / 100)
  • Quick jumper - text field to jump directly to a page number
  • showTotal - renders a total-count label
  • itemRender - fully custom prev/next/page widgets
  • disabled - entire component grayed out
  • size - normal, small, large
  • align - start, center, end
  • Controlled mode - via current + onChange
  • Uncontrolled mode - via defaultCurrent

Open Customizability

Per-instance overrides: activeColor, borderRadius, itemSize, itemSpacing, itemTextStyle, totalTextStyle, and more via props. Global defaults via SPaginationThemeData registered on ThemeData.

// Basic
SPagination(total: 50, defaultCurrent: 1, onChange: (p) {})

// All features
SPagination(
  total: 85,
  showSizeChanger: true,
  showQuickJumper: true,
  showTotal: (total, range) => '${range[0]}-${range[1]} of $total items',
)

// Controlled
SPagination(
  current: _page,
  total: 200,
  onChange: (p) => setState(() => _page = p),
)

// Simple mode
SPagination(total: 50, simple: true)
Inheritance

Constructors

SPagination({Key? key, int total = 0, int? current, int defaultCurrent = 1, int? pageSize, int defaultPageSize = 10, void onChange(int page, int pageSize)?, void onShowSizeChange(int current, int pageSize)?, bool showSizeChanger = false, List<int> pageSizeOptions = const <int>[10, 20, 50, 100], bool showQuickJumper = false, String showTotal(int total, List<int> range)?, bool simple = false, bool disabled = false, SPaginationSize size = SPaginationSize.normal, SPaginationAlign align = SPaginationAlign.start, Widget itemRender(int? page, SPaginationItemType type, Widget defaultWidget)?, bool responsive = true, Color? activeColor, Color? activeBorderColor, Color? activeTextColor, Color? defaultBorderColor, Color? defaultTextColor, Color? disabledColor, Color? disabledTextColor, Color? hoverBorderColor, Color? hoverTextColor, double? itemSize, double? itemSpacing, BorderRadius? borderRadius, TextStyle? itemTextStyle, TextStyle? totalTextStyle})
const

Properties

activeBorderColor → Color?
final
activeColor → Color?
final
activeTextColor → Color?
final
align → SPaginationAlign
Horizontal alignment.
final
borderRadius → BorderRadius?
Override item border radius.
final
current → int?
Controlled current page (1-indexed). Provide onChange to update.
final
defaultBorderColor → Color?
final
defaultCurrent → int
Initial page for uncontrolled mode. Defaults to 1.
final
defaultPageSize → int
Initial page size for uncontrolled mode. Defaults to 10.
final
defaultTextColor → Color?
final
disabled → bool
Disables all interactions.
final
disabledColor → Color?
final
disabledTextColor → Color?
final
hashCode → int
The hash code for this object.
no setterinherited
hoverBorderColor → Color?
final
hoverTextColor → Color?
final
itemRender → Widget Function(int? page, SPaginationItemType type, Widget defaultWidget)?
Custom item renderer. page is the page number (null for prev/next/ellipsis), type is SPaginationItemType. defaultWidget is the default widget - return it for default rendering.
final
itemSize → double?
Override per-item button size.
final
itemSpacing → double?
Override gap between items.
final
itemTextStyle → TextStyle?
Override item number text style.
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
onChange → void Function(int page, int pageSize)?
Called when the page changes. Receives (page, pageSize).
final
onShowSizeChange → void Function(int current, int pageSize)?
Called when the page size changes. Receives (current, pageSize).
final
pageSize → int?
Controlled page size.
final
pageSizeOptions → List<int>
Options available in the size-changer dropdown.
final
responsive → bool
When true (default), the component automatically adapts its layout based on available width:
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
showQuickJumper → bool
Show the quick-jump text field. Defaults to false.
final
showSizeChanger → bool
Show the page-size dropdown. Defaults to false.
final
showTotal → String Function(int total, List<int> range)?
Builder for the total-count label. Receives (total, [firstItem, lastItem]).
final
simple → bool
If true, renders as current / totalPages input instead of page buttons.
final
size → SPaginationSize
Size variant.
final
total → int
Total number of items.
final
totalTextStyle → TextStyle?
Override total label text style.
final

Methods

createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<SPagination>
Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited