鸿蒙开发-页面布局

1. 布局容器

Row为横向布局组件, Column为纵向布局组件, 类似于css的flex布局

1. 使用justifyContent属性方法 可以指定主轴元素对齐方式, 其值使用FlexAlign枚举
2. 使用alignItems属性方法 可以指定辅轴元素布局对齐方式, 其中, Row容器使用VerticalAlign枚举 / Column容器使用HorizontAlign枚举
3. 枚举值和css的flex布局几乎一样
4. 可以在函数中传入配置对象{ space }, 表示子元素之间的间隔距离 Row({ space: 20 }) {}
5. 子元素设置 .layoutWeight(1) 相当于 flex: 1

2.布局常用属性方法

1. margin(), 可以指定一个数值, 表示四个方向同一个外边距, 也可以传入一个对象, 单独配置top,left, bottom, right的值: margin({ top: 30, left: 50 })

2. padding(), 内边距 与margin用法相同