harmony 鸿蒙卡片使用动效能力

  • 2023-06-24
  • 浏览 (748)

卡片使用动效能力

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

表1 动效参数限制

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

icon-note.gif 说明:

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

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

@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 === 0 ? 90 : 0);
        })
        .rotate({ angle: this.rotateAngle })
        .animation({
          curve: Curve.EaseOut,
          playMode: PlayMode.Normal,
        })
    }.height('100%').alignItems(VerticalAlign.Center)
  }
}

你可能感兴趣的鸿蒙文章

harmony 鸿蒙应用模型

harmony 鸿蒙使用显式Want启动应用组件

harmony 鸿蒙使用隐式Want打开网址

harmony 鸿蒙AbilityStage组件容器

harmony 鸿蒙访问DataAbility

harmony 鸿蒙FA模型访问Stage模型DataShareExtensionAbility

harmony 鸿蒙AccessibilityExtensionAbility

harmony 鸿蒙常见action与entities

harmony 鸿蒙API切换概述

harmony 鸿蒙app和deviceConfig的切换

0  赞