Flutter: How to animate sliver persistent header?

Question

I'm new to flutter and would like to show one of the sliver persistent headers conditionally - if a button is clicked.

Also, I'd like for this header to be animated. When the before mentioned button is clicked, this header should go from width = 0 to width = screensize width, extending from left to the right side of the screen, until it is fully visible and as wide as the screen.

My structure is as follows, and the header I'd like to animate is called SliverHeader2(),.

 return Scaffold(
        body: 
      CustomScrollView(
        physics: const BouncingScrollPhysics(),
        slivers: <Widget>[
          SliverAppBar(
            flexibleSpace: FlexibleSpaceBar(
                titlePadding: EdgeInsets.zero,
                centerTitle: true,
                title: SizedBox(
                    height: 75,
                    child: Column(
                      children: <Widget>[
                        Padding(
                            padding: EdgeInsets.only(right: 10.0, left: 10.0),
                            child: Text("title for app")),
                      ],
                    ))),
            expandedHeight: 120,
          ),
          SliverHeader(),
          SliverHeader2(),
          SliverFixedExtentList(
            itemExtent: 200,
            delegate: SliverChildListDelegate([
              _buildListWidget(Colors.transparent, "Curry"),
              _buildListWidget(Colors.blue, "Rice"),
              _buildListWidget(Colors.purple, "Pizza"),
              _buildListWidget(Colors.blue, "Hamburger"),
              _buildListWidget(Colors.purple, "Noodles"),
              _buildListWidget(Colors.blue, "Eggs"),
              _buildListWidget(Colors.purple, "Salad"),
            ]),
          )
        ],
      ),
    ]);
  }