mainAxisAlignment vs crossAxisAlignment in Column, and textDirection in Row

WHAT THIS TESTS: Whether you understand that Flutter's main and cross axes are relative to the widget, not absolute directions, and whether you know which directional properties control which axis in Row versus Column.

A GOOD ANSWER COVERS: Four things in order. First, for a Column, state that the main axis is vertical and the cross axis is horizontal. mainAxisAlignment distributes free space vertically with values like start, center, end, spaceBetween, spaceAround, and spaceEvenly, while crossAxisAlignment positions children horizontally with values like start, center, end, and stretch. Second, clarify that in a Column, textDirection determines whether crossAxisAlignment.start means left or right, because the cross axis is horizontal. Third, pivot to Row and explain that the main axis is horizontal and the cross axis is vertical, so textDirection governs the main axis start and end, not crossAxisAlignment. Fourth, mention that in a Row, verticalDirection governs the cross axis start and end, and that conflating textDirection with crossAxisAlignment in a Row is a common mistake.

COMMON WRONG ANSWERS: Claiming that textDirection flips crossAxisAlignment.start and crossAxisAlignment.end in a Row. It does not; textDirection affects the main axis in a Row and the cross axis in a Column. Treating mainAxisAlignment and crossAxisAlignment as absolute vertical and horizontal properties rather than axis-relative ones. Saying that crossAxisAlignment.stretch is the default when it is actually crossAxisAlignment.center. Confusing CrossAxisAlignment.baseline with a general vertical alignment without noting it requires a horizontal cross axis and a textBaseline.

LIKELY FOLLOW-UPS: How would you reverse the order of children in a Row without changing the list? Answer: set textDirection to TextDirection.rtl. How would you align children to the bottom of a Row? Answer: set crossAxisAlignment to CrossAxisAlignment.end, which is controlled by verticalDirection. What happens if you set crossAxisAlignment to baseline in a Column? It has no effect because baseline requires a horizontal cross axis. How does verticalDirection affect a Column? It flips the main axis start and end.

ONE CONCRETE EXAMPLE: Imagine a Column inside a 400-pixel tall container with three 50-pixel tall children. mainAxisAlignment set to MainAxisAlignment.spaceBetween places the first child at the top, the last at the bottom, and the middle child centered between them. crossAxisAlignment set to CrossAxisAlignment.end aligns all children to the right edge of the column, and setting textDirection to TextDirection.rtl would make crossAxisAlignment.start align them to the right instead. Now imagine a Row with the same children. Setting textDirection to TextDirection.rtl makes the main axis flow from right to left, so mainAxisAlignment.start places children at the right edge. To align them to the bottom of the row, you use crossAxisAlignment.end, which is governed by verticalDirection, not textDirection.