Remove or Set Padding in ListTile

user_14976900 0
Viewed 1773

I'm completely new to Flutter / Dart so pls excuse if this is a noob question. I'm trying to remove the space on top and bottom of the Text of a ListTile element from the "first app" example code. So basically the two areas with the red pointers.

The code looks like

  return ListTile(
    //dense: true,
    //minVerticalPadding: 1.0,
    //contentPadding: EdgeInsets.symmetric(vertical: 1),
    tileColor: Colors.blue,
    title: Text(
      pair.asPascalCase,
      style: _biggerFont,
    ),
  );

As u can see, I tried dense, minVerticalPadding and contentPadding, but none of them did the job.

Thanks a lot for pointing me in the right direction!

dart flutter padding
2 Answers

You can use VisualDensity property to set minimum padding around Your ListTile. that value can't lower than -4 and upper than +4:

ListTile(
      contentPadding: EdgeInsets.zero,
      dense: true,
      visualDensity: VisualDensity(horizontal: -4, vertical: -4),
      title: Text("hello"),
    )

and if you want to keep your horizontal padding you can use this code:

ListTile(
      contentPadding: EdgeInsets.symmetric(vertical: 0, horizontal: 10),
      dense: true,
      visualDensity: VisualDensity(horizontal: 0, vertical: -4),
      title: Text("hello"),
    )
user_142306640

Try it

ListTile(
    visualDensity: VisualDensity(horizontal: 0, vertical: -4),
    contentPadding: EdgeInsets.all(0),
    tileColor: Colors.blue,
    title: Text(
       "hello"
    ),
),
user_112305240
Related