Flutter中SliverAppBar与SliverPersistentHeader的区别及用途差异

一、SliverAppBar与SliverPersistentHeader的核心区别 #

• 组件层级区别：SliverAppBar是基于SliverPersistentHeader封装的上层业务组件，Flutter源码中SliverAppBar的滚动效果最终都是通过内置的SliverPersistentHeader实现的；SliverPersistentHeader是更底层的基础能力组件，不绑定任何业务场景。
• 内置配置区别：SliverAppBar自带Material Design风格导航栏的全套预设能力，包括leading返回按钮、title标题、actions操作按钮、flexibleSpace折叠背景、bottom Tab栏等常用配置，不需要自定义UI就能直接使用；SliverPersistentHeader没有任何预设视觉样式，所有内容都需要开发者自行实现。
• 开发成本区别：SliverAppBar只需要调整自带参数就可以实现折叠、渐变、吸顶、跟随滚动隐藏等常用导航栏效果；SliverPersistentHeader需要开发者自定义继承SliverPersistentHeaderDelegate的子类，重写build、minExtent、maxExtent、shouldRebuild四个核心方法才能正常运行。

二、两类组件使用用途层面的最大差异 #

• SliverAppBar的使用场景高度垂直，专门用来实现可滚动页面的顶部导航栏交互，所有预设能力都是围绕导航栏的使用场景设计的，仅适合导航栏相关的折叠吸顶需求。
• SliverPersistentHeader是通用型滚动交互组件，没有绑定具体业务场景，只要是CustomScrollView中需要随滚动调整尺寸、滚动到顶部后吸顶的组件都可以用它实现，比如自定义筛选栏、悬浮搜索框、商品详情页的规格切换栏等非导航栏类的吸顶需求。

实际开发小技巧：如果需求是符合Material规范的常规导航栏，优先用SliverAppBar即可，开发效率更高；如果SliverAppBar的预设样式满足不了高度自定义的导航栏需求，或者要实现其他类型的吸顶组件，再选择SliverPersistentHeader自定义开发。

内容的提问来源于stack exchange，提问作者normativepcoder