Listview 如何删除颤振列表视图中的剪辑？

我有以下布局，一个

堆栈

，下面有一个

列表视图

，都在

列

中

当我滚动

列表视图时，正如预期的那样，它会在自己的框中自动剪辑

当滚动到上面的
堆栈
上时，我需要
列表视图
。好像它没有被限制在它的边界上

如何实现这一点？
您需要一个
自定义滚动视图
，并且您的标题小部件必须放置在
SliverPersistentHeader中
：

class MyPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        slivers: <Widget>[
          SliverPersistentHeader(
            delegate: MyHeader(),
            pinned: true,
          ),
          SliverList(delegate: SliverChildBuilderDelegate((context, index) {
            return ListTile(
              title: Text('Test $index'),
            );
          }))
        ],
      ),
    );
  }
}

class MyHeader extends SliverPersistentHeaderDelegate {
  @override
  Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
   return Stack(
      children: <Widget>[
        Container(color: Colors.blue.withOpacity(0.5)),
        Align(
          alignment: Alignment.bottomCenter,
          child: Text('Hello World'),
        )
      ],
    );
  }

  @override
  double get maxExtent => 100.0;

  @override
  double get minExtent => 100.0;

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) {
    return false;
  }
}


class MyPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            title: Text('Flutter Playground'),
            pinned: true,
            backgroundColor: Colors.orange.withOpacity(0.5),
          ),
          SliverList(delegate: SliverChildBuilderDelegate((context, index) {
            return ListTile(
              title: Text('Test $index'),
            );
          }))
        ],
      ),
    );
  }
}