Question 75840 in Flutter Question posted in
The official Flutter documentation can be found here.

How to reduce Spacing in an iterated row in Flutter Application

In my Flutter project I am trying to reduce unecessary spacing after the rows
I have the following UI in a flutter project

  for (final stuff in stuffs)
    if (stuff.item == item.id)
    Row(
        children: <Widget>[
          const Expanded(
            flex: 1,
            child: Text('Order: '),
          ),
          Expanded(
            flex: 1,
            child: ListTile(
              title: Text(stuff.order.toString()),
            ),
          ),
          const Expanded(
            flex: 1,
            child: Text('Reps: '),
          ),
          Expanded(
            flex: 1,
            child: ListTile(
              title: Text(stuff.repetitions.toString()),
            ),
          ),
          IconButton(
            icon: const Icon(Icons.edit),
            onPressed: () async {},
          ),
          IconButton(
            icon: Icon(Icons.delete),
            onPressed: () async {},
          ),
        ],
    ),

This is the current outcome:
enter image description here

My question and objective is how to reduce the spacing between each iteration. I want to minimize it as much as possible to reduce uneeded spacing

Tags:

2

Answers


  1. 0

    you can try wrapping the Row widget in a SizedBox widget with a smaller height.

    SizedBox(
  height: 30, // adjust the height as needed
  child: Row(
    children: <Widget>[
      // ...
    ],
  ),
),
    Login or Signup to reply.
  2. 0

    ListTile comes with default height, For your case you can remove ListTile widget. Also Check padding on IconButton, you may just need InkWell

      double get _defaultTileHeight {
    final bool hasSubtitle = subtitle != null;
    final bool isTwoLine = !isThreeLine && hasSubtitle;
    final bool isOneLine = !isThreeLine && !hasSubtitle;

    final Offset baseDensity = visualDensity.baseSizeAdjustment;
    if (isOneLine) {
      return (isDense ? 48.0 : 56.0) + baseDensity.dy;
    }
    if (isTwoLine) {
      return (isDense ? 64.0 : 72.0) + baseDensity.dy;
    }
    return (isDense ? 76.0 : 88.0) + baseDensity.dy;
  }
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search