CODEWITHSUNDEEP
flutterdartflutter-layout
Domi
Domi

Reputation: 217

Remove gap between widget

I want to close the gap between the lists but its just not working. the only option i have is to increase the gap : Sizedbox,spacer,divider

screenshot of my problem

code:

body: Container(
        child: Column(
          children: <Widget>[
            _mainList(Icon(Icons.cached), "Erste", "21:13 pm"),
            _mainList(Icon(Icons.cached), "Zweite", "21:13 pm"),
            _mainList(Icon(Icons.cached), "Dritte", "21:13 pm"),
            _mainList(Icon(Icons.cached), "Vierte", "21:13 pm"),
          ]
        )
  )

  Widget _mainList(Icon symbol, String name, String time){
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 30),
      child: ListTile(
        leading: symbol,
        title: Text(name, textScaleFactor: 1.2),
        trailing: Text(time, textScaleFactor: 1.3),
      ),
    );
  }

Upvotes: 0

Views: 157

Answers (4)

Joel jones
Joel jones

Reputation: 729

class MyWidget extends StatelessWidget {
  final List<String> _names = ["Erste","Zweite","Dritte","Vierte"];
  final List<String> _dates = ["21:13 pm","21:13 pm","21:13 pm","21:13 pm"];
  @override
  Widget build(BuildContext context) {
    return Container(
        child: ListView.builder(
          shrinkWrap: true,
          itemBuilder: (BuildContext context, int index){
            return ListTile(
            contentPadding: EdgeInsets.symmetric(vertical:0.0),
            title: Text(_names[index]),
            leading: Icon(Icons.cached),
            trailing: Text(_dates[index]),
            );
          }
        )
    );
  }
}

Upvotes: 1

Domi
Domi

Reputation: 217

i found a fix (kinda). just add:

dense: true

inside ListTile() it will reduce the gap a bit but thats all i can do for now. I'll keep looking for a better solution if anyone has any.

Upvotes: 0

Selim Kundak&#231;ıoğlu
Selim Kundak&#231;ıoğlu

Reputation: 2236

contentPadding of ListTile is EdgeInsets.symmetric(horizontal: 16.0) by default. So it has padding from top and bottom. You can change it like following:

ListTile(
  // I made zero padding for this example but you can give anything you want
  contentPadding: EdgeInsets.zero,
  leading: symbol,
  title: Text(name, textScaleFactor: 1.2),
  trailing: Text(time, textScaleFactor: 1.3),
)

Upvotes: 0

Sebastian
Sebastian

Reputation: 3894

That's because ListTile has it's own Padding. You can try changing the Padding of the ListTile. And if it's still not enough you should create your own Widget without vertical padding

You can always go to the source code of ListTile and copy and customize it.

Upvotes: 0

Related Questions