9.图解鸿蒙之布局-alignContent

在鸿蒙弹性布局这个奇妙的排版世界里，alignContent`参数可是个掌控大局的" 布局大师 "，专门负责打理多行 Flex 布局里，子元素各行在交叉轴剩余空间中的对齐方式。它有好几种超实用的" 对齐秘籍 "，能让页面布局瞬间变得丰富又规整。

1. FlexAlign.Start：从交叉轴起点出发

选了 `FlexAlign.Start`，就像是给子元素各行下达了 "向交叉轴起点看齐" 的指令。所有行都乖乖跑到交叉轴的起始位置站好，紧凑又整齐，一点儿不拖拉。看下面这段代码：

这些彩色背景的 Text 元素，一旦换行，新起的行都会紧贴着交叉轴起点排列，特别有秩序。

2. FlexAlign.Center：在交叉轴中心就位

要是把 alignContent 设成 FlexAlign.Center 子元素各行瞬间有了 "C 位意识"，一股脑儿往交叉轴的正中间挤，要在最显眼的地方把自己展示出来，让整个布局看起来平衡又美观：

在这里，多行文本元素稳稳地居于交叉轴中间，视觉上十分和谐。

3. FlexAlign.End：冲向交叉轴终点

当 alignConten 是 FlexAlign.End 时，子元素各行目标明确，都往交叉轴的终点奔去，要在那儿稳稳当当站定，有一种利落收尾的感觉：

4. FlexAlign.SpaceBetween：两端对齐，间距均分

这个 FlexAlign.SpaceBetween 可巧妙啦，子元素各行不仅与交叉轴两端对齐，而且各行之间的垂直间距还能平均分配，让空间利用得恰到好处，看着清爽又利落：

收起

5. FlexAlign.SpaceAround：等间距，首尾有讲究

FlexAlign.SpaceAround 上场后，子元素各行之间的间距变得相等啦，而且这个间距是元素首尾行与交叉轴两端距离的两倍，布局上有种均匀又柔和的美感：

6. FlexAlign.SpaceEvenly：绝对等间距

最后这个 FlexAlign.SpaceEvenly 把均匀做到了极致，不管是子元素各行之间的间距，还是首尾行与交叉轴两端的距离，通通都相等，整个布局精致又规整：

有了这么多好玩的 alignContent 对齐方式，在鸿蒙里打造多行弹性布局时，就能轻松变幻出各式各样精致又实用的页面效果啦。

PS：实际项目中如有出入，请告知博主，博主会第一时间修改得哇～