Remove default padding from FlexibleSpace title

Admin 1
Viewed 2809

enter image description here

Code:

CustomScrollView(
  slivers: <Widget>[
    SliverAppBar(
      expandedHeight: 200.0,
      flexibleSpace: FlexibleSpaceBar(
        title: Container(color: Colors.red, child: Text("Flexible title")),
        background: Image.asset("assets/chocolate.jpg", fit: BoxFit.cover),
      ),
    ),
    SliverList(delegate: SliverChildListDelegate(_buildChildren())),
  ],
);

Why there is a default padding in the title. I used Container to bring contrast so that the margin can be visible easily. Even I tried using centerTitle: false and it didn't change anything.

dart flutter
3 Answers

You can now use the titlePadding attribute like so:

      flexibleSpace: FlexibleSpaceBar(
              title: Text('Home'),
              titlePadding: EdgeInsetsDirectional.only(
                start: 0.0,
                bottom: 16.0,
              ),
            ),
user_28924370

In _FlexibleSpaceBarState in method build:

Container(
      padding: EdgeInsetsDirectional.only(
        start: effectiveCenterTitle ? 0.0 : 72.0,
        bottom: 16.0
      )

So, there is no way to remove this bottom padding except customization

For testing I've changed one string in source code to bottom: 0.0 and this padding disappeared.

user_71308200

not centered, EdgeInsetsDirectional.only(start 0, bottom: 16) otherwise.

final EdgeInsetsGeometry titlePadding;

user_55319970
Related