Spacer

The Spacer widget fills available space in a Row or Column. Place it before, between, or after other children to control where the empty space appears.

To distribute remaining space without a Spacer, set the parent Row or Column's Main Axis Alignment to Space Between, Space Around, or Space Evenly. When you add a Spacer, it consumes the remaining space, so these alignment options have no visible effect.

Add a Spacer as a child of a Row or Column. Its only setting, Flex, accepts a positive whole number and defaults to 1.

Two Spacers in a Row

The two Spacers divide the Row's remaining space in a 3:1 ratio: the Spacer with Flex 3 takes three times as much space as the one with Flex 1.

For a walkthrough, watch the Spacer video tutorial.