Flutter - remove space between items in ListView

user_6743114 0
Viewed 11442

I am using ListView.builder function to create a list of items. However, the space between each item in iOS is huge (screenshot). Do you know how to remove item? It seems it is by default, because I do not adding it.

code:

ListView:

return Scaffold(
    body: ListView.builder(
          itemCount: data.length,
          itemBuilder: (context, index) {
            final model = data[index];
            if (model.path.isEmpty)
              return Divider(color: Colors.grey[500], indent: 40.0);
            else
              return ItemMenu(model.path, model.name);
          }),

);

Item: 

return Row(
  crossAxisAlignment: CrossAxisAlignment.center,
  mainAxisAlignment: MainAxisAlignment.start,
  children: <Widget>[
    Image.asset(path, width: 100, height: 100,color: Colors.grey[500]),
    Text(name, style: MyTextTheme().getLightSmallGrey().copyWith(fontSize: 20.0, fontWeight: FontWeight.w700))
  ],
);

iOS Simulator screenshot

flutter padding android ios
3 Answers

If you are using a ListTile widgets as your ListView items, you can add the dense = true option:

ListView(
  children: [
    ListTile(
      dense: true,
      ...
    ),
    ListTile(
      dense: true,
      ...
    ),
  ]
),
user_13175590

i just resolved that issue but within an image network with "fit" property: Boxfit.cover/fill

user_119409320

Most of the answers recommended using dense: true but that just made the text smaller in my case and did not actually reduce the spacing between List Items.

Solution: Use visualDensity property instead within the ListTile.

Code Example: visualDensity:VisualDensity(horizontal: 0, vertical: -4),

user_170864590
Related