use_gap

v0.2.0WarningFixConfigurableWidget Best Practices

Replaces a SizedBox or single-direction Padding used as a spacer inside a multi-child widget (Column, Row, Wrap, Flex, ListView) with Gap from the gap package. Gap picks its axis from the parent, so flipping a Column to a Row cannot leave a height: behind.

many_lints:
  rules:
    use_gap: true
    prefer_spacing: false    # the opposing rule; leave it off

rules:
  use_gap: true
  prefer_spacing: false    # the opposing rule; leave it off

Add the package too:

dart pub add gap

Don’t

final widgets = <Widget>[
  Column(
    children: const [
      Text('First'),
      SizedBox(height: 16), // LINT
      Text('Second'),
    ],
  ),
  Row(
    children: const [
      Text('Left'),
      SizedBox(width: 8), // LINT
      Text('Right'),
    ],
  ),
];

Do

final widgets = <Widget>[
  Column(
    children: const [Text('First'), Gap(16), Text('Second')],
  ),
  Row(
    children: const [Text('Left'), Gap(8), Text('Right')],
  ),
];

Examples

A `SizedBox` spacer in a `Column`

// Don't
Column(
  children: const [
    Text('Total'),
    SizedBox(height: 12), // LINT
    Text('12.00 EUR'),
  ],
);

// Do
Column(
  children: const [Text('Total'), Gap(12), Text('12.00 EUR')],
);

A single-direction `Padding` used as a spacer

Padding is reported only when its EdgeInsets.only sets exactly one direction and that direction matches the parent’s axis:

// Don't
Row(
  children: const [
    Text('Name'),
    Padding(padding: EdgeInsets.only(left: 8)), // LINT
    Text('Ada'),
  ],
);

// Do
Row(
  children: const [Text('Name'), Gap(8), Text('Ada')],
);

Skipping short lists

min_children is the number of entries the children: list must have before a spacer inside it is reported. With min_children: 3, a two-element list is left alone:

analysis_options.yaml
many_lints.yaml

many_lints:
  rules:
    use_gap:
      min_children: 3

rules:
  use_gap:
    min_children: 3

// Not reported: only 2 children
Column(
  children: const [Text('Header'), SizedBox(height: 8)],
);

// Reported: 3 children
Column(
  children: const [
    Text('Header'),
    SizedBox(height: 8), // LINT
    Text('Body'),
  ],
);

Cases the rule leaves alone

A SizedBox that is not a pure spacer is never reported — it is doing real layout work that Gap cannot express:

Column(
  children: [
    // Has a child: it is a box, not a spacer.
    const SizedBox(height: 40, child: Text('Fixed row')),
    // Sets both dimensions.
    const SizedBox(width: 100, height: 100),
    // Wrong axis for a Column: a Gap here would change the layout.
    const SizedBox(width: 16),
  ],
);

Options

Option	Type	Default	Description
`min_children`	int	`1`	Minimum number of children in the list before spacers are reported

Known limitations

The Gap import is yours. The quick fix writes Gap(...); if package:gap is not imported the result parses but does not compile.

Only direct children. A spacer wrapped in anything — a Visibility, a conditional helper, a ...[] spread whose elements are built elsewhere — is not seen as a child of the flex.

Wrap and Flex have no fixed axis, so a spacer inside either is reported whichever dimension it sets.

Turning this rule off

rules:
  use_gap: false

To keep the rule on but skip certain paths, use per-rule exclude.

prefer_spacing — Opposing convention. Use the spacing argument on Row/Column instead of SizedBox spacers.
avoid_expanded_as_spacer — Use Spacer instead of Expanded with an empty child.
always_pass_global_key — Don’t create a GlobalKey inside build.
avoid_conditional_hooks — Never call hooks inside conditionals, loops, or ternaries.