用户登录

在这个内容列表的底部可以添加一个小部件,点按它的时候可以回到页面的顶部,在 lib/app/components 的下面新建一个文件,名字是 app_move_to_top.dart,在这个文件里定义一个小部件,名字是 AppMoveToTop。

小部件里添加一个属性,类型是 ScrollController ,名字是 scrollController,然后添加一个构造方法,里面添加一个参数,this.scrollController。

小部件先用一个 SliverToBoxAdapter ,它的 child 可以是一个 Container,用 padding 添加点边距,EdgeInsets.symmetric ,vertical 是 8 。 小部件的 child 用一个 TextButton ,它的 child 是一个 Text 小部件,文字是回到顶部,再添加一个 onPressed,点按这个按钮的时候,执行一下 scrollController.position.moveTo 这个方法,把 scrollController.position.minScrollExtent 交给它。

打开 post_index.dart,在这组 slivers 里面,可以添加一个 AppMoveToTop ,要给它提供一个 scrollController,这里就是 store 里的 scrollController 。

在模拟器上可以测试一下,现在列表视图的底部这里会有一个回到顶部按钮,点按它的时候就会回到这个滚动视图的顶部。

定义回到顶部小部件(AppMoveToTop)《 Flutter 移动端实例:滚动加载 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点