HarmonyOS/OpenHarmony原生应用-ArkTS万能卡片组件Stack

堆叠容器,子组件按照顺序依次入栈,后一个子组件覆盖前一个子组件。该组件从API Version 7开始支持。可以包含子组件。

一、接口

Stack(value?: { alignContent?: Alignment })

从API version 9开始,该接口支持在ArkTS卡片中使用。

二、属性

除支持通用属性外,还支持以下属性:

三、示例

复制代码
// xxx.ets
@Entry
@Component
struct StackExample {
  build() {
    Stack({ alignContent: Alignment.Bottom }) {
      Text('First child, show in bottom').width('90%').height('100%').backgroundColor(0xd2cab3).align(Alignment.Top)
      Text('Second child, show in top').width('70%').height('60%').backgroundColor(0xc1cbac).align(Alignment.Top)
    }.width('100%').height(150).margin({ top: 5 })
  }
}

四、效果展示

五、场景

卡片上实现堆叠的场景使用。

本文根据HarmonyOS官方文档整理。


©著作权归作者所有:来自51CTO博客作者鸿蒙时代的原创作品,请联系作者获取转载授权,否则将追究法律责任

HarmonyOS/OpenHarmony原生应用-ArkTS万能卡片组件Stack

https://blog.51cto.com/u_14946066/7773837

相关推荐
不爱吃糖的程序媛5 小时前
从 0 到 1:react-native-transformer-text-input 鸿蒙化适配实录
react native·transformer·harmonyos
不爱吃糖的程序媛5 小时前
React Native 三方库鸿蒙适配实战:react-native-emoji-popup(Fabric 自定义组件)从 0 到 1
react native·harmonyos·fabric
贾伟康5 小时前
【口算王|19】HarmonyOS ArkTS 回归测试实战:覆盖启动、空数据、异常输入和重复点击
软件测试·harmonyos·arkts·回归测试·hypium
贾伟康5 小时前
【句匠|09】HarmonyOS ArkTS 学习统计实战:汇总正确率、连续学习和薄弱类型
harmonyos·arkts·appstorage·学习统计·本地统计
贾伟康5 小时前
【口算王|17】HarmonyOS ArkTS 亮暗色与视觉令牌实战:集中颜色、间距和交互状态避免页面割裂
harmonyos·arkts·arkui·深色模式·ui设计
搬砖的kk5 小时前
从 0 到 1:react-native-screenshot-aware 鸿蒙适配实战(RNOH 0.84)
react native·华为·harmonyos
贾伟康6 小时前
【口算王|15】HarmonyOS ArkTS 本地状态持久化实战:让保存、删除和页面返回后的数据即时一致
harmonyos·arkts·数据持久化·状态管理·preferences
贾伟康6 小时前
【口算王|18】HarmonyOS ArkTS 权限与隐私实战:让 module.json5、功能说明和拒绝路径一致
harmonyos·arkts·权限管理·隐私合规·module.json5
ChinaDragonDreamer6 小时前
HarmonyOS:6.0 新增和增强特性
harmonyos·鸿蒙
Georgewu6 小时前
【HarmonyOS AI】 通用文字识别详解
harmonyos