HarmonyOS Next开发学习手册——开发卡片页面(三)

卡片页面能力

开发者可以使用声明式范式开发ArkTS卡片页面。如下卡片页面由DevEco Studio模板自动生成,开发者可以根据自身的业务场景进行调整。

ArkTS卡片具备JS卡片的全量能力,并且新增了动效能力和自定义绘制的能力,支持声明式范式的部分组件、事件、动效、数据管理、状态管理能力,详见“ArkTS卡片支持的页面能力。

ArkTS卡片支持的页面能力

ArkTS卡片支持的页面能力详见 学习ArkTS语言 和 ArkTS声明式开发范式 。

只有标识“支持在ArkTS卡片中使用”的组件和接口可用于ArkTS卡片,同时请留意卡片场景下的能力差异说明。

例如:以下说明表示@Component装饰器可在ArkTS卡片中使用。

卡片使用动效能力

ArkTS卡片开放了使用动画效果的能力,支持显式动画、属性动画、组件内转场能力。需要注意的是,ArkTS卡片使用动画效果时具有以下限制:

表1 动效参数限制

名称 参数说明 限制描述
duration 动画播放时长 限制最长的动效播放时长为1秒,当设置大于1秒的时间时,动效时长仍为1秒。
tempo 动画播放速度 卡片中禁止设置此参数,使用默认值1。
delay 动画延迟执行的时长 卡片中禁止设置此参数,使用默认值0。
iterations 动画播放次数 卡片中禁止设置此参数,使用默认值1。

说明

静态卡片不支持使用动效能力。

以下示例代码实现了按钮旋转的动画效果:

@Entry
@Component
struct AnimationCard {
  @State rotateAngle: number = 0;

  build() {
    Row() {
      Button('change rotate angle')
        .height('20%')
        .width('90%')
        .margin('5%')
        .onClick(() => {
          this.rotateAngle = (this.rotateAngle === 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值