Aligning widgets

MainAxisAlignment and crossAxisAlignment

For a row, the main axis runs horizontally and the cross axis runs vertically. For a column, the main axis runs vertically and the cross axis runs horizontally.

In the following example, each of the 3 images is 100 pixels wide. The render box (in this case, the entire screen) is more than 300 pixels wide, so setting the main axis alignment to spaceEvenly divides the free horizontal space evenly between, before, and after each image.

Aligning widgets — Structure map

Clickable & Draggable!

Aligning widgets — Related pages: