About linear layout (Row and Column) in Flutter
Main axis and longitudinal axis
For linear layout, there are main axis and vertical axis. If the layout is along the horizontal direction, then the main axis refers to the horizontal direction, and the vertical axis refers to the vertical direction; if the layout is along the vertical direction, then the main axis refers to the vertical direction, and the vertical axis is horizontal direction. In the linear layout, there are two enumeration classes MainAxisAlignment and CrossAxisAlignment that define the alignment, which represent the alignment of the main axis and the alignment of the vertical axis respectively.
1. Row
Row can arrange its child widgets horizontally.
For Row, MainAxis is the main axis of Row, that is, the horizontal direction. If horizontally arranged components need to be centered horizontally, you can set
mainAxisAlignment: MainAxisAlignment.center,//水平居中
CrossAxis is the vertical axis, that is, the vertical direction.
2. Column
Column can arrange its child widgets vertically.
For Column, MainAxis is the main axis of Column, that is, the vertical direction. If vertically arranged components need to be centered horizontally, you can set
crossAxisAlignment: CrossAxisAlignment.center,//水平居中
CrossAxis is the vertical axis, that is, the horizontal direction.
Note: In fact, both Row and Column will only occupy as much space as possible in the direction of the main axis, and the length of the vertical axis depends on the length of their largest child element.