How to reduce the margin between 'leading' and 'title' for ListTile ? Flutter

UPDATE

Now you can also use the following propertier:

  1. horizontalTitleGap - Between title and leading
  2. minVerticalPadding - Between title and subtitle
  3. minLeadingWidth - Minimum width of leading
  4. contentPadding - 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?

Tags:

Dart

Flutter