鸿蒙开发position与offset定位区别

绝对定位position
@Entry
@Component
struct Hxpy {
build() {
Column() {
Column() {
Text('红')
.fontColor(Color.White)
.fontSize(40)
.textAlign(TextAlign.Center) //文字居中
.aspectRatio(1)
.width(80)
.backgroundColor(Color.Red)
.position({x:0,y:0})
Text('红')
.fontColor(Color.White)
.fontSize(40)
.textAlign(TextAlign.Center) //文字居中
.aspectRatio(1)
.width(80)
.backgroundColor(Color.Red)
.position({x:80,y:80})
Text('红')
.fontColor(Color.White)
.fontSize(40)
.textAlign(TextAlign.Center) //文字居中
.aspectRatio(1)
.width(80)
.backgroundColor(Color.Red)
.position({x:160,y:160})
Text('红')
.fontColor(Color.White)
.fontSize(40)
.textAlign(TextAlign.Center) //文字居中
.aspectRatio(1)
.width(80)
.backgroundColor(Color.Red)
.position({x:240,y:240})
}
.width('100%')
.height(360)
.backgroundColor(Color.Pink)
}
.height('100%')
.width('100%')
}
}
相对定位offset
@Entry
@Component
struct Hxpy {
build() {
Column() {
Column() {
Text('红')
.fontColor(Color.White)
.fontSize(40)
.textAlign(TextAlign.Center) //文字居中
.aspectRatio(1)
.width(80)
.backgroundColor(Color.Red)
.offset({x:0,y:0})
Text('红')
.fontColor(Color.White)
.fontSize(40)
.textAlign(TextAlign.Center) //文字居中
.aspectRatio(1)
.width(80)
.backgroundColor(Color.Red)
.offset({x:80,y:0})
Text('红')
.fontColor(Color.White)
.fontSize(40)
.textAlign(TextAlign.Center) //文字居中
.aspectRatio(1)
.width(80)
.backgroundColor(Color.Red)
.offset({x:160,y:0})
Text('红')
.fontColor(Color.White)
.fontSize(40)
.textAlign(TextAlign.Center) //文字居中
.aspectRatio(1)
.width(80)
.backgroundColor(Color.Red)
}
.width('100%')
.height(360)
.backgroundColor(Color.Pink)
}
.height('100%')
.width('100%')
}
}