Flutter 在滚动时平滑地缩放应用栏标题

Question

现在我有模拟视图。当我在没有按钮的屏幕顶部时，我希望这个应用栏标题是原来的两倍大，而当我向下滚动时，它会平滑地缩放回带有两个按钮的当前形式。我尝试使用 sliverappbar 进行试验，但没有效果。我在这里使用带有标准应用程序栏的脚手架。有没有方便的实现方式，还是得自己写。如果有任何建议，我将不胜感激。

编辑：这里显示的东西 gif

Answer 1

您可以将 CustomScrollView 与 Slivers 结合使用，以获得您想要的结果。为此，我正在分享 example，您可以根据需要 customize。

 CustomScrollView(
      slivers: [
        SliverAppBar(
          pinned: true,
          expandedHeight: 120,
          flexibleSpace: FlexibleSpaceBar(
            title: Text("Barb's Latest",style: TextStyle(fontSize: 30),),titlePadding: EdgeInsets.all(15),
          ),automaticallyImplyLeading: true,
        ),
        SliverList(
            delegate: SliverChildBuilderDelegate(
                (context, index) => Container(
                      height: 100,
                      margin: EdgeInsets.only(bottom: 10),
                      color: Colors.red,
                    ),
                childCount: 50))
      ],
    )

Flutter 在滚动时平滑地缩放应用栏标题

Flutter smoothly scaling app bars title on scroll

flutter

flutter-layout