How to set minimum height of SliverAppBar within NestedScrollView in Flutter How to set minimum height of SliverAppBar within NestedScrollView in Flutter dart dart

How to set minimum height of SliverAppBar within NestedScrollView in Flutter


This is Actually an requested Feature - https://github.com/flutter/flutter/issues/21298

A work Around is to use Bottom

SliverAppBar(              // this is where I would like to set some minimum constraint              expandedHeight: 300,              floating: false,              pinned: true,              bottom: PreferredSize(                       // Add this code                preferredSize: Size.fromHeight(60.0),      // Add this code                child: Text(''),                           // Add this code              ),                                           // Add this code              flexibleSpace: Container(                padding: EdgeInsets.all(10),                height: 340,                width: double.infinity,                child: Column(                  mainAxisAlignment: MainAxisAlignment.end,                  crossAxisAlignment: CrossAxisAlignment.start,                  children: <Widget>[                    Container(                      height: 40,                    ),                    Container(                      height: 60,                    ),                    Expanded(child: Container()),                    Text('TEST'),                  ],                ),                decoration: BoxDecoration(                    image: DecorationImage(                        image: NetworkImage('https://picsum.photos/400/400'),                        fit: BoxFit.cover)),              ),            )


I don't know since exactly when, but as of now, you can also use the collapsedHeight property, documented as below:

https://api.flutter.dev/flutter/material/SliverAppBar/collapsedHeight.html

Currently I am on flutter 1.20.1 and I have this property available.


Your code also works fine after decreasing the size from container .

 SliverAppBar( // this is where I would like to set some minimum constraint          expandedHeight: 300,          floating: false,          pinned: true,          flexibleSpace: Container(            padding: EdgeInsets.all(10),            height: 340,            width: double.infinity,            child: Column(              mainAxisAlignment: MainAxisAlignment.end,              crossAxisAlignment: CrossAxisAlignment.start,              children: <Widget>[                Container(                  height: 10,  //decreas the size                ),                Container(                  height: 10, //decrease the size                ),                Expanded(child: Container()),                Text('TEST'),              ],            ),            decoration: BoxDecoration(                image: DecorationImage(                    image: NetworkImage('https://picsum.photos/400/400'),                    fit: BoxFit.cover)),          ),        )