HarmonyOS .scale没有动画效果

.scale根本就没有动画效果

@Component ImageScale {

  @State scaleValue: ScaleOptions = { x: 1, y: 1, z: 1 }

  build() {
    Column() {
      Image(this.viewModel?.item?.image?.hdUrl)
        .width("100%")
        .aspectRatio(1.0)
        .animation({ duration: 200, curve: "ease" })
        .scale(this.scaleValue)
        .gesture(TapGesture({ count: 2 }).onAction((event: GestureEvent) => {
          let width = event.target.area.width.valueOf() as number
          let height = event.target.area.height.valueOf() as number
          let centerX = event.fingerList[0].localX / width
          let centerY = event.fingerList[0].localY / height

          if (this.scaleMode) {
            this.scaleMode = false
            this.scaleValue = {x : 1, y : 1}
          } else {
            this.scaleMode = true
            this.scaleValue = {x : 2, y : 2, centerX: `${centerX * 100}%`, centerY:`${centerY * 100}%`}
          }
        }))
    }
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
HarmonyOS
2024-12-18 16:55:02
浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
aquaa

参考此代码实现

@Entry
@Component
struct AnimationPage {
  @State message: string = 'Hello World fhlsfslfslfhklafhlaskhfkjsfhjksadfhlkjsafsafhkjsfhkljfhjksafhkjasfksfh';
  @State textY:number = 0

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize(20)
          .fontWeight(FontWeight.Bold)
          .scale({x:1,y:this.textY})
          .animation({
            duration:2000,
            curve: "linear"
          }).id("text")

        Button("点击动画展开").onClick((ele)=>{
          this.textY = 1
        }).width(200).height(50)
          .backgroundColor(Color.Pink).borderRadius(10)
      }
      .width('100%')
    }
    .height('100%')
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
分享
微博
QQ
微信
回复
2024-12-18 18:20:05


相关问题
HarmonyOS 列表动画效果
513浏览 • 1回复 待解决
HarmonyOS List动画效果
498浏览 • 1回复 待解决
HarmonyOS 动画效果+手势
473浏览 • 1回复 待解决
HarmonyOS 动画效果实现
620浏览 • 1回复 待解决
HarmonyOS 旋转动画效果
387浏览 • 1回复 待解决
HarmonyOS clipShape 动画效果实现
165浏览 • 0回复 待解决
属性动画如何实现宽高动画效果
2408浏览 • 1回复 待解决
如何实现动画转场效果
1362浏览 • 1回复 待解决
HarmonyOS 实现按钮长按动画效果
708浏览 • 1回复 待解决
HarmonyOS 拍摄录制的动画效果
299浏览 • 1回复 待解决
HarmonyOS grid拖拽和增删动画效果
533浏览 • 1回复 待解决
文字动画效果如何实现
2240浏览 • 0回复 待解决
Tabs 出现/消失转场动画效果
795浏览 • 1回复 待解决
HarmonyOS没有动画组件
773浏览 • 1回复 待解决
panGesture结合动画实现fling效果
1288浏览 • 1回复 待解决
HarmonyOS grid拖拽效果如何添加动画
519浏览 • 1回复 待解决
HarmonyOS Text添加动画效果与预期不符
502浏览 • 1回复 待解决
HarmonyOS 没有全局的api loading动画
882浏览 • 1回复 待解决