Columninside the widget. So we can just put two children
Textin it. Also, we will put our other tutorials here.
Rowshow in the horizontal direction and the
Columnshow in the vertical direction. So their use is similar but different with its direction. So if we understand the one, The another will be easy to know.
mainAxisAlignmentcontrols the children to show in the horizontal direction of the
Row, But controls the vertical direction of the
Column. Let's look at the picture with its types.
mainAxisAlignment, the location of the children widgets will change in the horizontal direction. We can easily know the
start,center,end,but others may be a bit difficult, I will explain to you. When set to the
spaceBetween, the space between the children widgets will equal, in the picture, them equal to
a, and the first one is at the start, the last one will be at the end. The
spaceEvenlywill make the space of the children widgets equal. In the picture, they equal to
spaceAroundwill make the space around the children widgets equal, in the picture they equal to
c, so the space between them will be
c+c=2c. Let's see the code, I put four widgets
mainAxisAlignmentas the parameter of the
mainAxisAlignment. You can see the relationship between them.
crossAxisAlignmenthas many types, let's look at the code.
CrossAxisAlignment.baselineneed to use with
textBaseline, so we create a new one for it.
MainAxisSize.minset the space to min,
MainAxisSize.maxset the space to max. I define a function to use it.
verticalDirection, but it is a bit different between them. The
textDirectionis used in the horizontal direction, but
verticalDirectionis used in the vertical direction.They both control the start direction of children widgets' drawing. So let's look at the code.
Row/Columnis done, we look at above, we will know that the main parameter is the
crossAxisAlignment, if you understand them, the other will be easy to use. Hope you have some gain from this article.