#鸿蒙通关秘籍#如何使用动效及动画控制页面效果？

为了实现动效控制，可以利用Row布局包裹加载动画的圆形。通过translate实现圆的平移，scale控制缩放，这样可以让页面在滑动时显示出更自然的过渡效果。同时，在用户触发条件后，可以调节透明度等参数来控制动画的展示。

代码展示如下：

Row() {
  if ((this.floorHeight - Math.abs(this.offsetY)) > MINI_SHOW_DISTANCE && (this.floorHeight - Math.abs(this.offsetY)) <= TRIGGER_HEIGHT) {
    Row() {
      Blank()
        .width(this.roundSize)
        .height(this.roundSize)
        .borderRadius($r('app.integer.second_floor_circular_border_radius'))
        .scale(this.immediatelyScale)
        .backgroundColor($r('app.color.second_floor_circular_color'))
        .translate({ x: this.animationXLeft })
        .opacity(((this.mFloorHeight - Math.abs(this.offsetY)) / this.mFloorHeight))
    }
  }
}

private onTouchMove(event: TouchEvent) {
  if (((this.floorHeight - Math.abs(this.offsetY)) <= TRIGGER_HEIGHT) && (this.floorHeight - Math.abs(this.offsetY)) >= 60) {
    this.animationXLeft = 60 - ((this.floorHeight - Math.abs(this.offsetY)) / TRIGGER_HEIGHT) * 60;
    this.animationXRight = -60 + ((this.floorHeight - Math.abs(this.offsetY)) / TRIGGER_HEIGHT) * 60;
    this.immediatelyScale = {
      x: ((this.floorHeight - Math.abs(this.offsetY)) / TRIGGER_HEIGHT),
      y: ((this.floorHeight - Math.abs(this.offsetY)) / TRIGGER_HEIGHT)
    };
  }
}