【鸿蒙学习笔记】位置设置・offset・相对偏移・相对原本的位置进行偏移

官方文档：位置设置

offset：相对偏移，组件相对原本的布局位置进行偏移

Row + Text + offset

@Entry
@Component
struct Loc_offset {
  @State message: string = 'Hello World';

  build() {
    Column() {
      Column({ space: 20 }) {
        Row() {
          Text('1').size({ width: '50', height: '50' }).backgroundColor(Color.Yellow)
          Text('2').size({ width: '50', height: '50' }).backgroundColor(Color.Orange)
            .offset({ x: 0, y: 0 })
          Text('3').size({ width: '60', height: '50' }).backgroundColor(Color.Brown)
            .offset({ x: 10, y: 10 })
          Text('4').size({ width: '50', height: '50' }).backgroundColor(Color.Pink)
            .offset({ x: '-0%', y: '0%' })
          Text('5').size({ width: '50', height: '50' }).backgroundColor(Color.Grey)
            .offset({ x: '-10%', y: '10%' }) // -10向左 10向下
        }.width('90%').height(100).border({ width: 1, style: BorderStyle.Dashed })
      }.width('100%').margin({ top: 30 })
    }.width('100%')
  }
}