Collapsing title bar flutter with animation


I am trying to recreate this in Flutter ->

I.e., An app bar that resizes and aligns the title when you drag (Just the title, I don’t want the Captain America shield). I have looked into Sliver App Bar as below:

        controller: _scrollController,
        physics: NeverScrollableScrollPhysics(),
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
              automaticallyImplyLeading: false,
              backgroundColor: backgroundColor,
                  MediaQuery.of(context).size.height * 0.25,
              floating: false,
              pinned: true,
              centerTitle: true,
              flexibleSpace: FlexibleSpaceBar(
                title: Text("Testing",
                    style: TextStyle(
                      color: Colors.white,

However I am not sure where to go next from here.


I believe you are looking for the CupertinoSliverNavigationBar which is apart of the Cupertino Widget collection.

Answered By – Adrian Murray

Answer Checked By – Gilberto Lyons (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.