UIPaging
Multi-instance
Query-preserving
分页示例
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
561
–
570
共
1000
条记录
Pager B — wide side
500 records · 10 per page · widthSide: 5 · prefix page_b
total 500
side 5
201
–
210
共
500
条记录
Pager C — large page size
1,000 records · 100 per page · prefix page_c
total 1000
page-size 100
101
–
200
共
1000
条记录
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