鸿蒙开发之ArkUI 界面篇 二十 position绝对定位及层级zIndex
Text('学习选择1').fontSize(30).fontWeight(777).padding(15).width('100%')Text('学习选择2').fontSize(30).fontWeight(777).padding(15).width('100%')Text('学习选择3').fontSize(30).fontWeight(777).padding(15).width('10
·
position控制组件的位置,可以实现层叠效果,Android中的FramLayout,通常用在左上角有些图标之类,绝对定位后的组件不占用自身原有位置,每个子组件都有这个属性,只是不用这个属性的时候不起作用,.zIndex()属性要和position一起使用的时候才有效,完全是Android中的FramLayout效果,要实现如下效果:
核心代码是:
.position({
x:120,
y:150
})
.zIndex(1)
总结: .position 让组件移动到哪里就可以移动到哪里,但是单独的这个并没有层叠效果,要有层叠效果得position和zIndex一起使用
完整代码如下:
@Entry
@Component
struct Index {
build() {
Column(){
Text('学习选择1').fontSize(30).fontWeight(777).padding(15).width('100%')
Text('学习选择2').fontSize(30).fontWeight(777).padding(15).width('100%')
.backgroundColor(Color.Orange)
.position({
x:120,
y:150
})
.zIndex(1)
Text('学习选择3').fontSize(30).fontWeight(777).padding(15).width('100%')
Text('学习选择4').fontSize(30).fontWeight(777).padding(15).width('100%')
Text('学习选择5').fontSize(30).fontWeight(777).padding(15).width('100%')
}
}
}
需要资源的留言
更多推荐


所有评论(0)