鸿蒙系列--组件介绍之容器组件

Column容器：

        整个页面沿垂直方向布局

Row容器：

        整个页面沿水平方向布局

布局容器的基础知识：

        默认存在两根轴，主轴和交叉轴，是相互垂直的

        Column容器是垂直方向布局，主轴的方向是垂直方向，交叉轴则是水平方向

        Row容器是水平方向布局，主轴的方向是水平方向，交叉轴则是垂直方向

参数：

        space:子组件在主轴方向上的间距 可选

         Row({ space: 20 }) {
          Text('短信验证码登录')
          Text('忘记密码？')
        }

容器组件的属性：

• justifyContent：

        设置子组件在主轴方向上的对齐格式。参数类型：FlexAlingn

          Row({space:50}) {
            this.imageButton($r('app.media.app_icon'))
            this.imageButton($r('app.media.app_icon'))
            this.imageButton($r('app.media.app_icon'))
          }
          .justifyContent(FlexAlign.SpaceEvenly)
          .width('100%')

• alignltems

        设置子组件在交叉轴方向上的对齐格式

        Column容器中的参数类型HorizontalAlign (水平对齐)

        Row容器中的参数类型VerticalAlign (垂直对齐)