CODEWITHSUNDEEP
fluttertext-alignmentsliverappbar
TomD
TomD

Reputation: 614

FlexibleSpaceBar sub title text alignment

I am trying to have two text items in my FlexibleSpaceBar align left together. The problem is, the length of the first text item is adding padding to the second text item, pushing it to the right. So the longer the string is in the main title, the further out the sub title is displaying. Any help would be appreciated. Thank you

SliverAppBar(
          pinned: true,
          expandedHeight: 225.0,
          flexibleSpace: FlexibleSpaceBar(
            title: new Column(
              mainAxisAlignment: MainAxisAlignment.end,
              children: <Widget>[
                Text('Main Title'),
                Text('Sub Title',
                  style: new TextStyle(fontSize: 10)),
              ],
            ),
            background: Image.asset(
              'assets/home_top.png',
              fit: BoxFit.fill,
            ),
          ),
        ),

enter image description here

Upvotes: 0

Views: 1511

Answers (1)

Ary Anzh
Ary Anzh

Reputation: 474

you can add crossAxisAlignment: CrossAxisAlignment.start, under Column. Example :

FlexibleSpaceBar(
   title: Column(
    mainAxisAlignment: MainAxisAlignment.end,
    crossAxisAlignment: CrossAxisAlignment.start,
    children: const <Widget>[
        Text('Main Title'),
        Text('Sub Title', style: TextStyle(fontSize: 10)),
     ],
   ),
   background: Image.asset(
   'assets/home_top.png',
   fit: BoxFit.fill,
   ),
),

Upvotes: 2

Related Questions