和AppBar差不多，不过SliverAppBar支持滚动折叠的效果。唯一不同的地方就是AppBar最大高度由父类约束，SliverAppBar 完全由自身决定。
需要注意：SliverAppBar控件需要和CustomScrollView搭配使用,SliverAppBar要通常放在slivers的第一位，后面接其他sliver控件。
效果展示：
具体案例代码：
import 'package:flutter/material.dart';
class CustomScrollViewPage extends StatefulWidget {
const CustomScrollViewPage({Key? key}) : super(key: key);
@override
State<CustomScrollViewPage> createState() => _CustomScrollViewPageState();
}
class _CustomScrollViewPageState extends State<CustomScrollViewPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: CustomScrollView(slivers: [
SliverAppBar(
pinned: true,//设置为true时，当SliverAppBar内容滑出屏幕时，将始终渲染一个固定在顶部的收起状态
expandedHeight: 420.0,
flexibleSpace: FlexibleSpaceBar(
title: const Text("阿凡达2"),
background: Image.asset(
'images/test.jpg',
fit: BoxFit.fitWidth,
),
),
),
SliverGrid.count(
crossAxisCount: 4,
children: List.generate(8, (index) {
return Container(
color: Colors.primaries[index % Colors.primaries.length],
alignment: Alignment.center,
child: Text(
'$index',
style: const TextStyle(color: Colors.white, fontSize: 20.0),
),
);
}).toList(),
),
SliverList(
delegate: SliverChildBuilderDelegate((context, index) {
return Container(
height: 85,
alignment: Alignment.center,
color: Colors.primaries[index % Colors.primaries.length],
child: Text(
'$index',
style: const TextStyle(color: Colors.white, fontSize: 20.0),
),
);
}, childCount: 25),
)
]),
),
);
}
}
SliverAppBar属性：
leading：在标题前面显示的一个控件
title：标题文字
actions：功能菜单
flexibleSpace：FlexibleSpaceBar 这里就是用于实现滚动折叠的效果的地方
bottom：PreferredSizeWidget 通常用来实现Tab导航栏
elevation：阴影
shadowColor：阴影颜色
forceElevated = false：当elevation 不为 0 的时候，是否显示阴影
backgroundColor：背景色
iconTheme：icon主题
actionsIconTheme：功能菜单icon主题
textTheme：文本主题
centerTitle：标题是否居中显示
collapsedHeight：折叠高度，不设置的话会折叠到SliverAppBar高度
expandedHeight：展开高度
floating = false：true 的时候下滑先展示SliverAppBar，展示完成后才展示其他滑动组件内容
pinned = false：SliverAppBar收缩到最小高度的时候SliverAppBar是否可见，true：SliverAppBar会以折叠高度固定显示在头部，false：缩小到折叠高度后滑出页面
snap = false：snap为true，floating也要为true才会有效果。true的时候会监听你的手势结束时的动作时是下滑，那么SliverAppBar展开，上滑则是收缩折叠至上一次折叠的位置处，但是这个效果需要一个基础就是存在上一次折叠的位置，否则不生效
stretch = false：true：SliverAppBar完全展开后是否可以继续拉伸，注意这个需要外部滑动组件physics的支持（设置BouncingScrollPhysics()，滑动到标界可以继续滑动拥有回弹效果），否则是不会生效的
stretchTriggerOffset = 100.0：拉伸监听触发的偏移
onStretchTrigger：拉伸监听
shape：SliverAppBar形状
toolbarHeight = kToolbarHeight：SliverAppBar高度 默认56
leadingWidth：leading宽度
FlexibleSpaceBar属性：
title：标题
background：widget 背景
centerTitle：标题是否居中
titlePadding：标题内边距
collapseMode = CollapseMode.parallax：折叠模式
stretchModes = const <StretchMode>[StretchMode.zoomBackground]：拉伸模式
CollapseMode属性：
CollapseMode.none：背景不跟随滚动
CollapseMode.parallax：背景跟随滚动但是具有滚动视差效果
CollapseMode.pin：背景完全随着滚动
StretchMode属性：
zoomBackground：背景小部件将展开以填充额外的空间
blurBackground：使用[ImageFilter.blur]效果，背景将模糊
fadeTitle：随着用户过度滚动，FlexibleSpaceBar标题将消失
