可以通过属性来定制动画效果

playMode 取值

动画枚举 Curve的取值含义

代码演示：

@Entry
@Component
struct AnimationPage {
  @State translateY: number = 1
  @State bgColor: ResourceColor = Color.Green
  @State fontColor: ResourceColor = '#0094ff'
  @State fontWeight: number = 700

  build() {
    Column() {
      Text('一只小风华')

        .width(100)
        .height(100)
        .fontWeight(this.fontWeight)
        .backgroundColor(this.bgColor)
        .textAlign(TextAlign.Center)//组件平移
        .translate({ y: this.translateY })//透明度
        .opacity(1)//动画效果
        .animation({
          //动画时长  参数类型 number 默认值为：1秒
          duration: 1500, //动画播放时间为1.5秒

          //动画曲线  默认的枚举类型为:Curve.EaseOut
          curve: Curve.EaseInOut,//EaseInOut 表示动画以低速开始和结束，CubicBezier(0.42, 0.0, 0.58, 1.0)

          //设置动画延迟 默认不延迟播放 默认值为：0
          delay: 500, //延迟0.5秒播放

          //动画播放次数 默认值为1 设置为-1时将无限播放
          iterations: 5, //播放次数为5次

          //动画的播放模式，默认播放完成后重头开始播放 默认值为：PlayMode.Normal
          playMode: PlayMode.Alternate, //Alternate 动画在奇数次（1、3、5...）正向播放，在偶数次（2、4、6...）反向播放。

          //结束回调 动画播放完成时触发
          onFinish: () => {
            console.log('我是一只小风华~') //当动画播放完成时，控制台输出：我是一只小风华~
          }


        })
      Button('修改状态变量')
        .onClick(() => {
          this.bgColor = Color.Pink
          this.translateY = 100
          this.fontColor = Color.Pink
          this.fontWeight = 900
        })
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.SpaceAround)

  }
}

代码效果展示：                                         

控制台onFinish输出展示：