时间戳

首页 > 解决方案 > 标题条不浮动在 NestedScrollView 中的列表上

flutter - 标题条不浮动在 NestedScrollView 中的列表上

问题描述

我有一个 Material Design 屏幕，我在其中使用了RefreshIndicator下拉刷新效果。但是，我需要RefreshIndicator出现在SliverAppBar;下方 因此，我不能只留下SliverAppBar列表内部CustomScrollView，我需要在NestedScrollView.

问题来了，因为我似乎无法同步 list 和 header 的一般滚动。列表滚动正常，但标题没有。我希望它在向上/向下滚动时浮动并捕捉。


class Sample extends StatefulWidget {
  @override
  _SampleState createState() => _SampleState();
}

class _SampleState extends State<Sample> {
  final ScrollController _scrollController = new ScrollController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (context, _) => [
          SliverOverlapAbsorber(
            handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
            sliver: SliverAppBar(
              floating: true,
              snap: true,
              title: Text('Title'),
            ),
          )
        ],
        body: Builder(
          builder: (context) => RefreshIndicator(
            onRefresh: () { /* do stuff */ },
            child: CustomScrollView(
              controller: _scrollController, // needed for an infinite scroll items loading effect
              slivers: <Widget>[
                SliverOverlapInjector(
                  handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context)
                )
                // more slivers
              ],
            ),
          )
        ),
      ),
    );
  }
}

我想我遗漏了一些关于头条重叠的注入/吸收的东西。

我怎样才能使SliverAppBar和一般CustomScrollView滚动同步？

标签： flutterdart

解决方案

该解决方案适用于我的情况：

添加floatHeaderSlivers: true到 NestedScrollView

https://github.com/flutter/flutter/issues/17518#issuecomment-641629975

推荐阅读