#鸿蒙通关秘籍#如何在HarmonyOS中同时应用多种转场效果？

为了使组件在过渡中同时具备多种效果，combine函数可以被用于在一个TransitionEffect里组合多个动画效果。以下代码展示了如何结合透明度和缩放效果：

@Entry
@Component
struct CombinedTransitionExample {
  @State showImage: boolean = true;

  build() {
    Column() {
      Button(this.showImage ? 'Hide' : 'Show').width(80).height(30).margin(30)
        .onClick(() => {
          this.showImage = !this.showImage;
        })
      if (this.showImage) {
        Image($r('app.media.sampleImage')).width(200).height(200)
          .transition(TransitionEffect.OPACITY.animation({ duration: 1500 }).combine(
            TransitionEffect.scale({ x: 0.5, y: 0.5 }).animation({ duration: 1500 })
          ))
      }
    }.width('100%')
  }
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.

在本例中，TransitionEffect.OPACITY与TransitionEffect.scale通过combine函数同时被应用于同一个组件。通过此函数，可以为用户界面设计出多样化的动感过渡效果。