在HarmonyOS NEXT开发中.scale没有动画效果?

在HarmonyOS NEXT开发中.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}%`} 
          } 
        })) 
    } 
  } 
}
阅读 718
1 个回答

参考此代码实现:

@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%') 
  } 
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题