Scrolling
Flutter has many built-in widgets that automatically scroll and also offers a variety of widgets that you can customize to create specific scrolling behavior.
Basic scrolling
#Many Flutter widgets support scrolling out of the box
and do most of the work for you. For example,
SingleChildScrollView
automatically scrolls its
child when necessary. Other useful widgets include
ListView
and GridView
.
You can check out more of these widgets on the
scrolling page of the Widget catalog.
Scrollbar | Flutter widget of the week
ListView | Flutter widget of the week
Infinite scrolling
#When you have a long list of items
in your ListView
or GridView
(including an infinite list),
you can build the items on demand
as they scroll into view. This provides a much
more performant scrolling experience.
For more information, check out
ListView.builder
or GridView.builder
.
Specialized scrollable widgets
#The following widgets provide more specific scrolling behavior.
A video on using DraggableScrollableSheet
:
DraggableScrollableSheet | Flutter widget of the week
Turn the scrollable area into a wheel with ListWheelScrollView
!
ListWheelScrollView | Flutter widget of the week
Fancy scrolling
#Perhaps you want to implement elastic scrolling, also called scroll bouncing. Or maybe you want to implement other dynamic scrolling effects, like parallax scrolling. Or perhaps you want a scrolling header with very specific behavior, such as shrinking or disappearing.
You can achieve all this and more using the
Flutter Sliver*
classes.
A sliver refers to a piece of the scrollable area.
You can define and insert a sliver into a CustomScrollView
to have finer-grained control over that area.
For more information, check out Using slivers to achieve fancy scrolling and the Sliver classes.
Nested scrolling widgets
#How do you nest a scrolling widget
inside another scrolling widget
without hurting scrolling performance?
Do you set the ShrinkWrap
property to true,
or do you use a sliver?
Check out the "ShrinkWrap vs Slivers" video:
除非另有说明,本文档之所提及适用于 Flutter 的最新稳定版本,本页面最后更新时间: 2024-08-05。 查看文档源码 或者 为本页面内容提出建议。