How to reduce the margin between 'leading' and 'title' for ListTile ? Flutter
UPDATE
Now you can also use the following propertier:
horizontalTitleGap
- Between title and leadingminVerticalPadding
- Between title and subtitleminLeadingWidth
- Minimum width of leadingcontentPadding
- Internal padding
OLD
You can use the visualDensity
property to reduce the space.
ListTile(
visualDensity: VisualDensity(horizontal: -4, vertical: 0),
title: Text("xyz")
);
The visualDensity
value can be changed from -4.0 to 4.0
. Lower the value, more compact the view.
P.S. This solution is similar to a different question
This question is about the gap between leading
and title
. But the other question is about top/bottom
spacing
you're ultimately better off building your own containers - there's nothing special or complicated about ListTile. that way you can easily customize things like the spacing between a title and a button. just use something like so:
Container(
padding: new EdgeInsets.symmetric(vertical: 6.0, horizontal: 6.0),
margin: EdgeInsets.symmetric(vertical: 6.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(6.0),
border: Border.all(color: Colors.black),
),
child: Column(
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
IconButton(
icon: Icon(myLeadingIcon),
onPressed: () => {},
),
Padding(padding: EdgeInsets.only(left: 20.0)),
Text(_myTitle),
],
),
...
The only answer that worked for me is to Matrix transform the title widget.
Here, the title text padding is decreased by 16.
ListTile(
leading: Icon(icon),
title: Transform(
transform: Matrix4.translationValues(-16, 0.0, 0.0),
child: Text("Title text",
style: TextStyle(fontSize: 18, color: textPrimary)),
),
);
Source: How to set the padding between leading and title from Flutter ListTile?