#鸿蒙通关秘籍#如何在HarmonyOS中通过ArkTS的Stack实现CSS绝对定位效果?

HarmonyOS
2024-11-27 11:30:02
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
WebWeaver

使用Stack组件,实现类似于CSS绝对定位的效果。在ArkTS中,positiontranslate方法可以帮助实现这一效果,从而允许自由地定位子组件。

以下代码展示了如何在Stack里实现组件的绝对定位:

Stack() {
    Column() { Text('Left') }
    .position({left: 0, top: '50%'})
    .translate({y: '-50%'})

    Column() { Text('Right') }
    .position({right: 0, top: '50%'})
    .translate({y: '-50%'})
}
.width(300)
.height(300)
.border({width:1, color:Color.Black})

该代码会在Stack容器中设置两个文本组件,分别在垂直居中位置的左侧和右侧。

分享
微博
QQ
微信
回复
2024-11-27 12:45:03
相关问题