跳到主内容

滚动

Flutter 滚动支持概述

Flutter 具有许多内置小部件,可以自动滚动,并提供各种可自定义的小部件,以创建特定的滚动行为。

基本滚动

#

许多 Flutter 小部件开箱即用就支持滚动,并为您完成大部分工作。例如,SingleChildScrollView 会在必要时自动滚动其子项。其他有用的组件包括 ListViewGridView。您可以在 Widget 目录的 滚动页面 上查看更多这些小部件。

在 YouTube 上观看(在新标签页中打开):"Scrollbar | Flutter widget of the week"

在 YouTube 上观看(在新标签页中打开):"ListView | Flutter widget of the week"

无限滚动

#

当您的 ListViewGridView 中有大量项目(包括无限列表)时,您可以按需构建滚动到视图中的项目。这提供了更高效的滚动体验。有关更多信息,请查看 ListView.builderGridView.builder

专用可滚动小部件

#

以下小部件提供更具体的滚动行为。

关于使用 DraggableScrollableSheet 的视频

在 YouTube 上观看(在新标签页中打开):"DraggableScrollableSheet | Flutter widget of the week"

使用 ListWheelScrollView 将可滚动区域变成一个轮子!

在 YouTube 上观看(在新标签页中打开):"ListWheelScrollView | Flutter widget of the week"

炫酷滚动

#

也许您想实现弹性滚动,也称为滚动反弹。或者您可能想实现其他动态滚动效果,例如视差滚动。或者您可能想要一个具有非常特定行为的滚动标题,例如缩小或消失。

您可以使用 Flutter Sliver* 类来实现所有这些以及更多。Sliver 指的是可滚动区域的一部分。您可以定义并将 sliver 插入到 CustomScrollView 中,以便对该区域进行更细粒度的控制。

有关更多信息,请查看 使用 slivers 实现炫酷滚动Sliver 类

嵌套滚动小部件

#

如何在不影响滚动性能的情况下将一个滚动小部件嵌套在另一个滚动小部件中?您是将 ShrinkWrap 属性设置为 true,还是使用 sliver?

观看 "ShrinkWrap vs Slivers" 视频

在 YouTube 上观看(在新标签页中打开):"ShrinkWrap vs Slivers | Decoding Flutter"