Wrap widget in Flutter - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of the Wrap widget in Flutter?

The Wrap widget arranges its children in horizontal or vertical runs and automatically moves to the next line or column when there is no more space, similar to how words wrap in a paragraph.

beginner

Which property of the Wrap widget controls the spacing between the children horizontally?

The spacing property controls the horizontal space between the children inside a Wrap widget.

intermediate

How does the Wrap widget differ from the Row widget in Flutter?

Unlike Row, which places children in a single horizontal line and may overflow, Wrap automatically moves children to the next line when space runs out, preventing overflow.

beginner

What does the runSpacing property do in a Wrap widget?

The runSpacing property sets the vertical space between the lines (runs) of children in the Wrap widget.

intermediate

Can the Wrap widget arrange children vertically instead of horizontally? If yes, how?

Yes, by setting the direction property to Axis.vertical, the Wrap widget arranges children vertically and wraps horizontally.

What happens when children in a Wrap widget exceed the available horizontal space?

A They automatically wrap to the next line.

B They overflow and cause an error.

C They get clipped and hidden.

D They resize to fit in one line.

The Wrap widget automatically moves children to the next line when there is no more horizontal space.

Which property controls the vertical spacing between lines in a Wrap widget?

A spacing

B runSpacing

C alignment

D crossAxisAlignment

The runSpacing property sets the vertical space between the runs (lines) of children.

How do you change the direction of wrapping from horizontal to vertical in a Wrap widget?

A Set <code>direction: Axis.vertical</code>

B Set <code>verticalWrap: true</code>

C Set <code>orientation: vertical</code>

D Set <code>wrapDirection: vertical</code>

The direction property controls the main axis; setting it to Axis.vertical makes children wrap vertically.

Which widget would you use to prevent overflow when placing many buttons in a horizontal line?

A Row

B Column

C Wrap

D Stack

The Wrap widget automatically moves children to the next line to avoid overflow.

What does the spacing property in a Wrap widget affect?

A Vertical space between runs

B Margin outside the widget

C Padding inside children

D Horizontal space between children

The spacing property sets the horizontal space between children.

Explain how the Wrap widget manages layout differently from a Row widget in Flutter.

Think about what happens when you have many items in a row that don't fit on screen.

Describe the roles of spacing and runSpacing properties in the Wrap widget.

One controls space between items in a line, the other between lines.