UIPaging
Multi-instance
Query-preserving
Pagination Example
Render multiple UIPaging widgets on the same page with independent prefix and otherQuery so each pager preserves the others' state.
Pagers
3
Records
2,500
Styles
3
Pager A — default width
1,000 records · 10 per page · prefix page_a
total 1000
page-size 10
751
–
760
of
1000
entries
Pager B — wide side
500 records · 10 per page · widthSide: 5 · prefix page_b
total 500
side 5
231
–
240
of
500
entries
Pager C — large page size
1,000 records · 100 per page · prefix page_c
total 1000
page-size 100
1
–
100
of
1000
entries
How it works
Each pager owns its own query parameter prefix
prefix
Sets the query key — e.g. ?page_a=2. Lets several pagers coexist independently.
otherQuery
Forward the other pagers' current page so clicking one pager doesn't reset the others.
widthSide
Number of page links on each side of the current page. Larger values produce wider button strips.
File References
Where this example lives
-
View
example/lib/widgets/example/pagination.j2.html -
Controller
example/lib/controllers/home_controller.dart → paginationExample() -
Paging widget
example/lib/widgets/template/paging.j2.html