Flutter smoothly scaling app bars title on scroll

user_5153786 0
Viewed 125

for now I have mock of view as presented. I want this app bars title to be twice as big when I'm on the top of the screen with no buttons, and scale smoothly back to current form with two buttons when I scroll down. I tried to experiment with sliverappbar but without effect. I use here scaffold with standard app bar. Is there a convenient way to achieve it, or I have to write it myself. I'd be thankful for any advice.

EDIT: Something like showed here gif

enter image description here

flutter-layout flutter
1 Answers

You can use CustomScrollView with Slivers to achieve your desired result. I'm sharing an example for this you can customize it as per your need.

 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))
      ],
    )
user_145331260
Related