华为仓颉鸿蒙HarmonyOS NEXT原生UI容器组件Stack(View层级叠加)

89 阅读2分钟

应用层叠方式布局子组件的容器组件。

子组件

可以包含子组件。

构造函数

init()

public init()

创建一个Stack容器。

init(() -> Unit)

public init(child: () -> Unit)

创建一个包含子组件的Stack容器。

参数名参数类型必填默认值描述
child() -> Unit{ => }声明容器内的子组件。

init(Alignment)

public init(alignContent: Alignment)

创建一个Stack容器,子组件对齐方式是alignContent。

参数名参数类型必填默认值描述
alignContentAlignmentAlignment.Center设置子组件在容器内的对齐方式。

init(Alignment, () -> Unit)

public init(alignContent: Alignment, child: () -> Unit)

创建一个包含子组件的Stack容器,子组件对齐方式是alignContent。

参数名参数类型必填默认值描述
alignContentAlignmentAlignment.Center设置子组件在容器内的对齐方式。
child() -> Unit{ => }声明容器内的子组件。

函数

alignment(Alignment)

public func alignment(value: Alignment): This

设置所有子组件在容器内的对齐方式。

参数名参数类型必填默认值描述
valueAlignmentAlignment.Center子组件在容器内的对齐方式。

自定义枚举类型

Alignment

对齐方式。

枚举值描述
TopStart顶部起始端。
Top顶部横向居中。
TopEnd顶部尾端。
Start起始端纵向居中。
Center横向和纵向居中。
End尾端纵向居中。
BottomStart底部起始端。
Bottom底部横向居中。
BottomEnd底部尾端。

通用属性/通用事件

通用属性:除文本样式外,其余全部支持。

通用事件:全部支持

示例代码

import ohos.base.*
    import ohos.component.*
    import ohos.state_manage.*
    import ohos.state_macro_manage.*
    import std.collection.*
    
    @Entry
    @Component
    class MyView {
        func build() {
            Stack(Alignment.Bottom) {
                Text("First child, show in bottom")
                .width(90.percent)
                .height(100.percent)
                .backgroundColor(0xd2cab3)
                .align(Alignment.Top)
                Text("Second child, show in top")
                .width(70.percent)
                .height(60.percent)
                .backgroundColor(0xc1cbac)
                .align(Alignment.Top)
            }
            .width(100.percent)
            .height(150)
            .margin(top: 5)
        }
    }

图片

如对您有帮助,帮忙点个“在看 、关注” 让更多的人受益~!

技术交流群可加wx“LB-9191” 备注cangjie