flutter - 如何让 SliverAppBar 在 sub_page 的 SliverList 之前滚动

Question

当我 scoll 时，我希望可以SliverAppBar先滚动。我该怎么做？现在先sub_page。

预期效果：在滚动动作中，首选项是SliverAppBar. SliverAppBar显示/隐藏后，继续滚动sub_page。演示（https://github.com/fanybook/cornerstone/blob/master/_docs/flutter_improve_scroll_priority.mp4?raw=true）

关键是有子页面（和底部导航栏）。如果单页可以通过多个 SliverAppBar/bottom 和 NestedScrollView 的 body/SliverList 实现。

标签： flutterflutter-layout

Answer 1

您正在寻找的内容的最小示例 -

Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: Scaffold(
        body: CustomScrollView(
          slivers: <Widget>[
            SliverAppBar(
              title: Text('Demo'),
              pinned: false,

              bottom: PreferredSize(
                  child: TabBar(
                    tabs: <Widget>[
                      Text('Tab 1'),
                      Text('Tab 2'),
                      Text('Tab 3'),
                    ],
                  ),
                  preferredSize: Size.fromHeight(25.0)),
            ),
            SliverList(
              delegate: SliverChildBuilderDelegate((context, int) {
                return Text('Dummy text');
              }),
            ),
          ],
        ),
      ),
    );
  }