UIView animate - 旋转和放大,然后旋转和缩小

Joe*_*Joe 3 xcode rotation uiviewanimation ios swift

我有一个子类图像视图,我想淡入、放大和旋转,然后继续旋转,同时缩小和淡出。

我正在使用带有完成处理程序的 UIView 动画块来处理收缩。

问题是它不是流畅的动画。在完成处理程序运行之前,动画会在再次运行之前停止。我需要它成为一部漂亮的“猛扑”动画。

代码如下:

    let duration: TimeInterval = 3.0
    let rotate = CGAffineTransform(rotationAngle: CGFloat(Double.pi))


    UIView.animate(withDuration: duration * 3, delay: 0, options: [.curveLinear], animations: {
        // initial transform
        self.alpha = 0
        self.transform = CGAffineTransform(scaleX: 0.1, y: 0.1)
        // initial spin for duration of animaton
        UIView.animate(withDuration: duration * 3, delay: 0.0, options: [.curveLinear], animations: {
            self.transform = rotate
        }, completion: nil)

        // scaling and fading
        UIView.animate(withDuration: duration, delay: 0, options: [.curveLinear], animations: {
            UIView.setAnimationRepeatCount(3)
            self.transform = self.transform.scaledBy(x: 0.8, y: 0.8)
            self.alpha = 1
        }) { (true) in
            UIView.animate(withDuration: duration, animations: {
                UIView.setAnimationRepeatCount(3)
                self.transform = self.transform.scaledBy(x: 0.1, y: 0.1)
                self.alpha = 0
            })
        }
    }, completion: nil)
Run Code Online (Sandbox Code Playgroud)

如何让动画在淡入和放大的同时始终旋转,然后再缩小和淡出?整个动画应持续 3 秒,并重复 3 次。谢谢。

小智 5

在此输入图像描述

我在 onCompletion 开始时看到旋转时出现轻微的卡顿。

我使用您的代码创建了一个缩减(如下图的蓝色视图所示)和橙色视图中的一个变体。这是从模拟器中取出来的,转成GIF动画,所以速度变慢了。当整个变换按比例缩小时,橙色视图继续旋转。

这是橙色视图的layoutSubviews()的代码

override func layoutSubviews() {
    super.layoutSubviews()
    
    let duration: TimeInterval = 3.0
    let rotate = CGAffineTransform(rotationAngle: CGFloat(Double.pi))
    
    // initial transform
    self.alpha = 0
    self.transform = CGAffineTransform(scaleX: 0.1, y: 0.1)
    
    // initial spin for duration of animaton
    UIView.animate(withDuration: duration,
                   delay: 0.0,
                   options: [.curveLinear],
                   animations: {
                      self.transform = rotate;
                    },
                   completion: nil)
    // scaling and fading
    UIView.animate(withDuration: duration/2.0, animations: {
      self.transform = self.transform.scaledBy(x: 0.8, y: 0.8)
      self.alpha = 1
    }) { (true) in
      UIView.animate(withDuration: duration/2.0, animations: {
        self.transform = self.transform.scaledBy(x: 0.1, y: 0.1)
        self.alpha = 0
      })
    }
  }
Run Code Online (Sandbox Code Playgroud)