SliverAppBar

Scaffold(
  body: CustomScrollView(
    slivers: [
      const SliverAppBar(
        title: Text('SliverAppBar 示例'),
        pinned: true,               // 折叠后保留标题栏
        expandedHeight: 200,        // 展开高度
        flexibleSpace: FlexibleSpaceBar(
          background: Image(
            image: NetworkImage(
                'https://picsum.photos/500/300?image=10'),
            fit: BoxFit.cover,
          ),
        ),
      ),
      SliverList(
        delegate: SliverChildBuilderDelegate(
          (_, index) => ListTile(title: Text('Item $index')),
          childCount: 50,
        ),
      ),
    ],
  ),
)

DefaultTabController(
  length: 2,
  child: SliverAppBar(
    pinned: true,
    floating: true,
    snap: true,
    expandedHeight: 220,
    flexibleSpace: const FlexibleSpaceBar(
      title: Text('带 Tab 的折叠'),
      background: FlutterLogo(),
    ),
    bottom: const TabBar(
      tabs: [Tab(text: 'Tab1'), Tab(text: 'Tab2')],
    ),
  )
)

SliverAppBar(
  expandedHeight: 90,
  pinned: false, // 不固定，随滚动完全滑走
  flexibleSpace: FlexibleSpaceBar(
    background: Align(
      alignment: Alignment.center,
      child: Padding(
        padding: const EdgeInsets.fromLTRB(12, 0, 12, 0),
        child: TextField(
          decoration: InputDecoration(
            hintText: '搜索...',
            prefixIcon: const Icon(Icons.search),
            border: OutlineInputBorder(
              borderRadius: BorderRadius.circular(8.0),
            ),
          )
        ),
      ),
    ),
  ),
)

flexibleSpace: FlexibleSpaceBar(
  title: const Text('Parallax'),
  background: Stack(
    fit: StackFit.expand,
    children: [
      Image.network('https://picsum.photos/600/400?image=20', fit: BoxFit.cover),
      DecoratedBox(
        decoration: BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [Colors.transparent, Colors.black54],
          ),
        ),
      ),
    ],
  ),
)

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: DefaultTabController(
        length: 2,
        child: Scaffold(
          body: NestedScrollView(
              // 1. 头部区域（SliverAppBar + TabBar）
              headerSliverBuilder: (context, innerBoxIsScrolled) => [
                SliverOverlapAbsorber(
                  // 处理 TabBarView 与 SliverAppBar 的滚动重叠
                  handle:
                      NestedScrollView.sliverOverlapAbsorberHandleFor(context),
                  sliver: SliverAppBar(
                    title: const Text('NestedScrollView Demo'),
                    centerTitle: true,
                    // 折叠后仍保留标题栏
                    pinned: true,
                    // 下拉立即展开
                    floating: true,
                    snap: true,
                    // 展开高度（包含 flexibleSpace + TabBar）
                    expandedHeight: 220,
                    // 视差背景
                    flexibleSpace: FlexibleSpaceBar(
                      background: Image.network(
                        'https://picsum.photos/600/300?image=30',
                        fit: BoxFit.cover,
                      ),
                    ),
                    // 底部 TabBar
                    bottom: const TabBar(
                      tabs: [
                        Tab(text: 'Tab A'),
                        Tab(text: 'Tab B'),
                      ],
                    ),
                  ),
                ),
              ],
              // 2. 主体区域（TabBarView）
              body: TabBarView(
                children: [
                  // Tab A：用 CustomScrollView
                  _TabPage(
                    key: const PageStorageKey('TabA'),
                    itemCount: 30,
                    color: Colors.amber.shade50,
                  ),
                  // Tab B：用 ListView
                  _TabPage(
                    key: const PageStorageKey('TabB'),
                    itemCount: 20,
                    color: Colors.blue.shade50,
                  ),
                ],
              ),
            ),
          ),
        ),
      )
    );
  }
}


class _TabPage extends StatelessWidget {
  final int itemCount;
  final Color color;
  const _TabPage({
    super.key,
    required this.itemCount,
    required this.color,
  });
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      top: false, // 顶部由 SliverAppBar 处理
      bottom: false,
      child: Builder(
        builder: (context) => CustomScrollView(
          key: key,
          slivers: [
            // 让 TabBarView 的滚动与外层 NestedScrollView 同步
            SliverOverlapInjector(
              handle:
                  NestedScrollView.sliverOverlapAbsorberHandleFor(context),
            ),
            // 实际内容
            SliverPadding(
              padding: const EdgeInsets.all(8),
              sliver: SliverFixedExtentList(
                itemExtent: 72,
                delegate: SliverChildBuilderDelegate(
                  (_, index) => Card(
                    color: color,
                    child: ListTile(
                      title: Text('Item $index'),
                    ),
                  ),
                  childCount: itemCount,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

SliverAppBar.new({Key? key, Widget? leading, bool automaticallyImplyLeading = true, Widget? title, List<Widget>? actions, Widget? flexibleSpace, PreferredSizeWidget? bottom, double? elevation, double? scrolledUnderElevation, Color? shadowColor, Color? surfaceTintColor, bool forceElevated = false, Color? backgroundColor, Color? foregroundColor, IconThemeData? iconTheme, IconThemeData? actionsIconTheme, bool primary = true, bool? centerTitle, bool excludeHeaderSemantics = false, double? titleSpacing, double? collapsedHeight, double? expandedHeight, bool floating = false, bool pinned = false, bool snap = false, bool stretch = false, double stretchTriggerOffset = 100.0, AsyncCallback? onStretchTrigger, ShapeBorder? shape, double toolbarHeight = kToolbarHeight, double? leadingWidth, TextStyle? toolbarTextStyle, TextStyle? titleTextStyle, SystemUiOverlayStyle? systemOverlayStyle, bool forceMaterialTransparency = false, bool useDefaultSemanticsOrder = true, Clip? clipBehavior, EdgeInsetsGeometry? actionsPadding})

SliverAppBar.large({Key? key, Widget? leading, bool automaticallyImplyLeading = true, Widget? title, List<Widget>? actions, Widget? flexibleSpace, PreferredSizeWidget? bottom, double? elevation, double? scrolledUnderElevation, Color? shadowColor, Color? surfaceTintColor, bool forceElevated = false, Color? backgroundColor, Color? foregroundColor, IconThemeData? iconTheme, IconThemeData? actionsIconTheme, bool primary = true, bool? centerTitle, bool excludeHeaderSemantics = false, double? titleSpacing, double? collapsedHeight, double? expandedHeight, bool floating = false, bool pinned = true, bool snap = false, bool stretch = false, double stretchTriggerOffset = 100.0, AsyncCallback? onStretchTrigger, ShapeBorder? shape, double toolbarHeight = _LargeScrollUnderFlexibleConfig.collapsedHeight, double? leadingWidth, TextStyle? toolbarTextStyle, TextStyle? titleTextStyle, SystemUiOverlayStyle? systemOverlayStyle, bool forceMaterialTransparency = false, bool useDefaultSemanticsOrder = true, Clip? clipBehavior, EdgeInsetsGeometry? actionsPadding})

SliverAppBar.medium({Key? key, Widget? leading, bool automaticallyImplyLeading = true, Widget? title, List<Widget>? actions, Widget? flexibleSpace, PreferredSizeWidget? bottom, double? elevation, double? scrolledUnderElevation, Color? shadowColor, Color? surfaceTintColor, bool forceElevated = false, Color? backgroundColor, Color? foregroundColor, IconThemeData? iconTheme, IconThemeData? actionsIconTheme, bool primary = true, bool? centerTitle, bool excludeHeaderSemantics = false, double? titleSpacing, double? collapsedHeight, double? expandedHeight, bool floating = false, bool pinned = true, bool snap = false, bool stretch = false, double stretchTriggerOffset = 100.0, AsyncCallback? onStretchTrigger, ShapeBorder? shape, double toolbarHeight = _MediumScrollUnderFlexibleConfig.collapsedHeight, double? leadingWidth, TextStyle? toolbarTextStyle, TextStyle? titleTextStyle, SystemUiOverlayStyle? systemOverlayStyle, bool forceMaterialTransparency = false, bool useDefaultSemanticsOrder = true, Clip? clipBehavior, EdgeInsetsGeometry? actionsPadding})