Android视角看鸿蒙第十一课-鸿蒙的布局之层叠布局Stack

Android视角看鸿蒙第十一课-鸿蒙的布局之层叠布局

导读

在Android中我个人认为,最离不开的就是LinearLayout和FrameLayout了,RelativeLayout我都基本不用的。

所以我把层叠布局排在了第二位。

官方描述

如何定义层叠布局

Stack组件为容器组件,容器内可包含各种子组件。其中子组件默认进行居中堆叠。

javascript 复制代码
  Stack({ }) {
    Column(){}.width('90%').height('100%').backgroundColor('#ff58b87c')
    Text('text').width('60%').height('60%').backgroundColor('#ffc3f6aa')
    Button('button').width('30%').height('30%').backgroundColor('#ff8ff3eb').fontColor('#000')
  }.width('100%').height(150).margin({ top: 50 })

下面看效果图

可以看到

Stack的第一个子组件宽度是90,默认是居中的(和Android有区别,写完一定要跑,不要太自信

text在Column 的上层,遮挡了部分Column

buttom在text的上层,遮挡了部分text。

控制Stack内的子控件对齐方式

alignSelf

上篇文章我们学到了子控件可以通过
alignSelf(ItemAlign.End)

来单独设定子View的对齐方式,我们继续尝试下。

这里选项有限,大概是不支持的,看看alignSelf的描述

好了,确定alignSelf仅仅适用于线性布局(Column&Row)

继续往下走,如果说不支持单独设置Stack组件中子控件的对齐方式那显然是不可能的。

alignContent参数

Stack组件通过alignContent参数实现位置的相对移动。看图

很清晰,Top|Bottom +Start|Bottom,缺少时居中。

调用方式在文档上是这么写的

好奇能不能.出来呢? 答案是可以的

问题又来了,既然两种方式都可以,那么如果两种方式设置的不一致哪个优先级更高呢?

继续试试

两种方式设置的不一致,还是调用方法设置的优先级更高

那么如何给子控件设置自己独有的居中方式呢?

答案是我没找着,也参考了其他同学的帖子,也都未提到。

有知道的同学可以留言告诉我一下,也造福其他看到我这篇帖子的同学,感谢啦。

层叠次序

在Android中也是可以静态声明,或者动态调整子View的次序的,可能有很多同学都没用过。

Stack容器中兄弟组件显示层级关系可以通过Z序控制的zIndex属性改变。zIndex值越大,显示层级越高,即zIndex值大的组件会覆盖在zIndex值小的组件上方。

看个效果

text完全遮挡了botton

那么你好奇吗?这个zindex默认是多少呢?可以是负数吗?小数可以不?

先来看这个,

字段定义是number,这个的number包含小数,所以可以写,但没有用。

负数可以,

那么这个zIndex默认是多少呢

我修改了Column的颜色透明度,使结果显而易见。

结束

总结下Android有的基本都有,默认对齐是居中,暂未找到子控件单独控制自己对其方式的字段或方法。

可以通过zindex打破默认的堆叠次序,支持负数,小数取整。

相关推荐
tyqtyq2214 小时前
药品说明书解读 —— AI 安全用药助手,鸿蒙原生应用深度解析
人工智能·学习·华为·生活·harmonyos
风华圆舞14 小时前
鸿蒙HarmonyOS滚字组件实战 —— 逐字 Slot Roll,从浏览器到原生 ArkUI
华为·harmonyos·arkui·slottext·measureutils·共享时间轴·滚字
不羁的木木15 小时前
HarmonyOS APP实战-画图APP - 第8篇:图像效果应用(亮度/模糊/灰度)
华为·harmonyos
●VON15 小时前
HarmonyKit | 鸿蒙开发展望:HarmonyKit 未来路线图与社区共建
华为·单元测试·harmonyos·鸿蒙
HarmonyOS_SDK15 小时前
借助游戏预启动提前加载游戏,读条快人一步
harmonyos
不羁的木木16 小时前
HarmonyOS APP实战-画图APP - 第3篇:矩形与圆形绘制
华为·harmonyos
solo_9916 小时前
Android Event 日志完全指南
android
孙晓鹏life16 小时前
MySQL-Seconds_behind_master的精度误差
android·mysql·adb
绝世番茄16 小时前
Column 与 if/else 条件渲染:动态子组件的布局行为
华为·harmonyos·鸿蒙
雨白17 小时前
C 语言文件操作核心
android