CODEWITHSUNDEEP
flutter
Silas Ribeiro
Silas Ribeiro

Reputation: 183

Trailing Flat buttons Overflows in ListTile

I have a ListView with ListTile. Each ListTile has a title with Text, subtitle with Text, and trailing with two Flatbuttons into a Column. But the Flatbuttons overflows the ListTitle. How can I make sure that the FlatButtons stays within the bounds?

FlatButtons overflows

Upvotes: 0

Views: 2612

Answers (2)

lazos
lazos

Reputation: 1075

Use Expanded

  trailing: Column(
    children: <Widget>[
      Icon(Icons.keyboard_arrow_right),
      Expanded(
        child: FlatButton(
          child: Text('text'),
          onPressed: () => {},
        ),
      )
    ],
  ),

Upvotes: 2

Cristian Bregant
Cristian Bregant

Reputation: 1906

Do you really need flatbutton in this case or is it better to use IconButton()? Anyways remember that Flat buttons have a minimum size of 88.0 by 36.0 which can be overridden with [ButtonTheme].

And remember also that the heights of the leading and trailing widgets are constrained according to the Material spec. An exception is made for one-line ListTiles for accessibility.

https://api.flutter.dev/flutter/material/ListTile-class.html

eg:

ButtonTheme(
  minWidth:60,
  height:40
  child:FlatButton(
    child:Text("HelloWorld")
  )
)

Upvotes: 2

Related Questions