仿照keyframes实现效果

仿照keyframes实现效果

HarmonyOS
2024-07-24 11:06:10
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
平方厘米

在实现类似效果时,可以采用delay动画的方式,或者在onFinish回调函数中触发新的动画,以确保操作的连贯性和效果的一致性。

参考代码如下:

@Entry
@Component
struct AnimateToExample {
  @State widthSize: number = 250;
  @State heightSize: number = 100;
  @State rotateAngle: number = 0;
  private flag: boolean = true;
  @State opacityValue: number = 1;

  build() {
    Column() {
      Button('change size')
        .width(this.widthSize)
        .height(this.heightSize)
        .margin(30)
        .opacity(this.opacityValue)
        .onClick(() => {
          if (this.flag) {
            animateTo({
              duration: 2000,
              curve: Curve.EaseOut,
              iterations: 1,
              playMode: PlayMode.Normal,
              onFinish: () => {
                animateTo({
                  duration: 2000,
                  curve: Curve.EaseOut,
                  iterations: 1,
                  playMode: PlayMode.Normal,
                  onFinish: () => {
                  }
                }, () => {
                  this.opacityValue = 0.2;
                })
              }
            }, () => {
              this.opacityValue = 0.5;
            })
          }
        })
    }.width('100%').margin({ top: 5 })
  }
}
分享
微博
QQ
微信
回复
2024-07-24 19:56:43
相关问题
如何实现类似keyframes效果
2692浏览 • 1回复 待解决
实现层叠广告滑动效果
1857浏览 • 1回复 待解决
HarmonyOS 如何实现粒子效果
944浏览 • 1回复 待解决
如何实现视频滤镜效果
3272浏览 • 1回复 待解决
HarmonyOS 如何实现阴影效果
1079浏览 • 1回复 待解决
如何实现动画转场效果
2145浏览 • 1回复 待解决
长按实现各类振动效果
1917浏览 • 1回复 待解决
Navigation实现Tabs切换效果
2552浏览 • 1回复 待解决
HarmonyOS 效果实现方案
1834浏览 • 1回复 待解决
如何实现星级评分效果
1342浏览 • 1回复 待解决
HarmonyOS 动画效果实现
1469浏览 • 1回复 待解决
canvas如何实现水印效果
2131浏览 • 1回复 待解决
基于原生实现高级显示效果
1777浏览 • 1回复 待解决
HarmonyOS clipShape 动画效果实现
1218浏览 • 0回复 待解决
HarmonyOS 如何实现数据翻页效果
946浏览 • 1回复 待解决
如何实现全局浮窗效果
2455浏览 • 1回复 待解决
如何实现按钮的点击效果
1565浏览 • 2回复 待解决
HarmonyOS如何实现文字轮播效果
1450浏览 • 1回复 待解决
HarmonyOS 如何实现跑分效果
705浏览 • 1回复 待解决
应用怎么实现半模态效果
3170浏览 • 1回复 待解决
文字动画效果如何实现
3872浏览 • 0回复 待解决
HarmonyOS 如何实现滚动渐变效果
1306浏览 • 1回复 待解决
如何实现组件的阴影效果
2122浏览 • 1回复 待解决
HarmonyOS 如何实现阴影边框效果
1983浏览 • 1回复 待解决