flutter - 如何使用底部重叠组件制作固定的 SliverAppBar 标题

Question

我正在尝试使用CustomScrollViewand低于输出Slivers。

但是我有两个问题SliverAppBar，

1）标题栏隐藏滚动

2) SliverAppBarbottom属性在滚动时溢出。

到目前为止，这是我的代码。我已在 CodePen 和此处添加了最低代码，因此任何人都可以直接访问它。

在CodePen 上

import 'package:flutter/material.dart';

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: CustomScrollView(
          slivers: <Widget>[
            SliverAppBar(
              pinned: true,
              floating: false,
              elevation: 0,
              expandedHeight: 300.0,
              title: Text("Title"),
              flexibleSpace: FlexibleSpaceBar(
                background: Container(
                  child: Image.network(
                      'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR1VQ7GnY9bpez5Ec8Ce2acx-K3KqaDg91i6A&usqp=CAU'),
                ),
                collapseMode: CollapseMode.parallax,
              ),
              bottom: PreferredSize(
                preferredSize: const Size.fromHeight(0.0),
                child: Transform.translate(
                  offset: const Offset(0, 50),
                  child: Container(
                    color: Colors.blue,
                    padding: EdgeInsets.only(
                        top: 20, bottom: 20, left: 50, right: 50),
                    margin: EdgeInsets.only(left: 20, right: 20, bottom: 20),
                    child: Text("Section"),
                  ),
                ),
              ),
            ),
            SliverList(
              delegate: SliverChildBuilderDelegate(
                (context, index) => ListTile(
                  tileColor: (index % 2 == 0) ? Colors.white : Colors.green[50],
                  title: Center(
                    child: Text('$index',
                        style: TextStyle(
                            fontWeight: FontWeight.normal,
                            fontSize: 50,
                            color: Colors.greenAccent[400]) //TextStyle
                        ), //Text
                  ), //Center
                ), //ListTile
                childCount: 51,
              ), //SliverChildBuildDelegate
            )
          ],
        ),
      ),
    );
  }
}