在上篇文章中我们学了SingleChildScrollView
这个滑动控件,现在我们学习一下CustomScrollView
这个控件。
CustomScrollView这个控件是针对多个滚动布局的组件,比如顶部一个GridView
,底部又来一个ListView
,而要求两个界面具有联动性,如果是单纯的GridView
跟ListView
的话,这时候并不能保证一致的滑动性,比如,GridView
滑动完ListView
再进行滑动。这时候我们就需要一个胶水
,把这些彼此独立的可滚动组件粘
起来,恰恰CustomScrollView
就是胶水
的角色。所以:CustomScrollView
可以又多个滑动的组件,且它的子组件都是遵循Sliver(薄片)
的功能,共用CustomScrollView
的Scrollable
。一般的,这些组件差不多都是Sliver
开头,如:
SliverAppBar,
SliverPadding,
SliverFixedExtentList,
SliverList
等等。
如何区分一个子组件是否是Sliver
?
如果直接将ListView、GridView
作为CustomScrollView
是不行的,因为它们本身是可滚动组件而并不是Sliver
!因此,为了能让可滚动组件能和CustomScrollView
配合使用,Flutter提供了一些可滚动组件的Sliver
版,如SliverList、SliverGrid
等。实际上Sliver
版的可滚动组件和非Sliver版的可滚动组件最大的区别就是前者不包含滚动模型(自身不能再滚动),而后者包含滚动模型
个人通俗一点理解就是:ListView、GridView
这些组件本身已经是可滚动组件了,所以它们就不能再被嵌套在CustomScrollView
中了。
而在CustomScrollView
中的Sliver(薄片)
组件多以Sliver开头
,如SliverAppBar
,SliverList
等等。
下面引用一段CustomScrollView
中含多个Sliver
薄片的代码,页面。
import 'package:flutter/material.dart';
class CustomScrollViewTestRoute extends StatelessWidget {
@override
Widget build