flutter - 当我开始向上滚动时，我的 sliverappbar 不会展开，它只会在我再次到达列表顶部时展开

Question

我有一个带有 sliverappbar 的nestedsrcollview，当我按预期向下滚动时它会缩小，但是当我向上滚动时应用程序栏不会展开，直到我到达顶部（到列表中的第一项），我知道这是在查看文档中的示例之后就不行了。它应该在您开始滚动的那一刻展开或收缩，而不是在您完成向上或向下滚动时

class App extends StatefulWidget {
  @override
  _AppState createState() => _AppState();
}

class _AppState extends State<App>
    with SingleTickerProviderStateMixin {
  final List<Tab> myTabs = <Tab>[
    Tab(
      child: Container(
        child: Icon(//icon),
      ),
    ),
    Tab(
      child: Container(
        child: Icon(//icon),
      ),
    ),
    Tab(
      child: Container(
        child: Icon(
          //icon,
        ),
      ),
    ),
    Tab(
      child: Container(
        child: Icon(
          //icon,
        ),
      ),
    ),
  ];

  final List tabChildren = [
    Child1(

      key: PageStorageKey<String>('1'),
    ),
    Child2(
      key: PageStorageKey<String>('2'),
    ),
    Child3(
      key: PageStorageKey<String>('3'),
    ),
   Child4(
      key: PageStorageKey<String>('4'),
    ),
  ];




  @override
  void initState() {
    super.initState();
    _tabController = TabController(vsync: this, length: myTabs.length)

  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: NestedScrollView(

        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            new SliverAppBar(


              title: Text(
                'Dummy text',
                style: Theme.of(context)
                    .textTheme
                    .title
                    .copyWith(color: Colors.white),
              ),
              pinned: true,
              floating: true,

              forceElevated: innerBoxIsScrolled,
              bottom: TabBar(

                controller: _tabController,
                tabs: myTabs,
              ),
            ),

          ];
        },

        body: TabBarView(
          controller: _tabController,
          children: [

            SafeArea(
              top: false,
              bottom: false,
              child: 

                tabChildren[0], // listView

            ),
            SafeArea(
              top: false,
              bottom: false,
              child: 

                tabChildren[1], // listView


            ),
            SafeArea(
              top: false,
              bottom: false,
              child: 
                tabChildren[2], // listView


            ),
            SafeArea(
              top: false,
              bottom: false,
              child:  

              tabChildren[3], // listView

            ),
          ],
        ),
      ),

    );
  }
}

标签： flutterflutter-sliver

Answer 1

设置以下属性。

snap: true,
floating: true

例子：

new SliverAppBar(

              title: Text(
                'Dummy text',
                style: Theme.of(context)
                    .textTheme
                    .title
                    .copyWith(color: Colors.white),
              ),
              floating: true,
              snap: true,
              forceElevated: innerBoxIsScrolled,
              bottom: TabBar(

                controller: _tabController,
                tabs: myTabs,
              ),
            ),