学习笔记（七）：ArkUi-线性布局 (Row/Column)常用属性

一、space属性

设置排列方向上子元素的间距，使各子元素在排列方向上有等间距效果。

 

二、alignItems属性

设置子元素在交叉轴（排列方向的垂直方向）上的对齐方式。且在各类尺寸屏幕中，表现一致。

其中，交叉轴为垂直方向时，取值为VerticalAlign类型，水平方向取值为HorizontalAlign类型。

1、垂直排列示例：

2、水平排列示例：

 

三、justifyContent属性

设置子元素在容器主轴上的排列方式。可以从主轴起始位置开始排布，也可以从主轴结束位置开始排布，或者均匀分割主轴的空间

1、justifyContent(FlexAlign.Start) 主轴方向首段对齐

 

2、justifyContent(FlexAlign.Center)  主轴方向中心对齐

3、justifyContent(FlexAlign.End) 主轴方向末端对齐

4、justifyContent(FlexAlign.SpaceBetween) 主轴方向均匀分配

 5、justifyContent(FlexAlign.SpaceAround)

主轴方向均匀分配元素，相邻元素之间距离相同。第一个元素到行首的距离和最后一个元素到行尾的距离是相邻元素之间距离的一半。

6、justifyContent(FlexAlign.SpaceEvenly)

主轴方向均匀分配元素，相邻元素之间的距离、第一个元素与行首的间距、最后一个元素到行尾的间距都完全一样

 

 

官方示例：

1、Column容器内子元素在垂直方向上的排列图

2、Row容器内子元素在水平方向上的排列图