HarmonyOS 如何让组件(Image)沿着贝塞尔曲线运动,行成一种飘屏动画效果

HarmonyOS
2024-12-24 16:29:43
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
FengTianYa

请参以下示例:

@Entry
@Component
struct MotionPathExample {
  @State toggle: boolean = true
  @State marginLeft: number = 50

  build() {
    Column() {
      Image($r('app.media.startIcon')).margin({ left: this.marginLeft, top: 50 }).width(50).height(50)
        .motionPath({
          path: 'M 300 300 Q 600 1000 100 2000',
          from: 0.0,
          to: 1.0,
          rotatable: false
        })
        .onClick(() => {
          animateTo({ duration: 4000, curve: Curve.Linear }, () => {
            this.marginLeft = 51
          })
        })

      Text('测试')
        .margin({ left: 20, top: 30 })
    }
    .width('100%')
    .height('100%')
    .alignItems(HorizontalAlign.Start)
  }
}
分享
微博
QQ
微信
回复
2024-12-24 20:05:24
相关问题
HarmonyOS 曲线绘制
338浏览 • 1回复 待解决
有没有实现曲线的相关库?
359浏览 • 1回复 待解决
HarmonyOS 如何自己定义一种结构
159浏览 • 1回复 待解决
使用Promise实现一种串行调用方式
1437浏览 • 1回复 待解决
HarmonyOS一种类似总线通知的功能
611浏览 • 1回复 待解决
如何使用弹簧动画曲线
1080浏览 • 1回复 待解决