如何使图像旋转（动画）

Question

我有一个正方形的图像，我知道如何让它旋转。但不知道如何让它像这个动画一样旋转：

注意它是如何旋转的...然后稍微停止......然后再次旋转......依此类推。

我所拥有的只是一个基本旋转，但不像上面的gif：

extension UIView {
    func rotate360Degrees(duration: CFTimeInterval = 3) {
        let rotateAnimation = CABasicAnimation(keyPath: "transform.rotation")
        rotateAnimation.fromValue = 0.0
        rotateAnimation.toValue = CGFloat(M_PI * 2)
        rotateAnimation.isRemovedOnCompletion = false
        rotateAnimation.duration = duration
        rotateAnimation.repeatCount=Float.infinity
        self.layer.add(rotateAnimation, forKey: nil)
    }
}

有关如何做到的任何想法？

Answer 1

您需要使用加速和减速的定时功能，也称为易于放松的定时功能。

我已经修改了你的功能，以使用Core Animation的标准easy-in-ease-out计时功能：

extension UIView {
    func rotate360Degrees(duration: CFTimeInterval = 0.8) {
        let rotateAnimation = CABasicAnimation(keyPath: "transform.rotation")
        rotateAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
        let radians = CGFloat.pi / 4
        rotateAnimation.fromValue = radians
        rotateAnimation.toValue = radians + .pi
        rotateAnimation.isRemovedOnCompletion = false
        rotateAnimation.duration = duration
        rotateAnimation.repeatCount=Float.infinity
        self.layer.add(rotateAnimation, forKey: nil)
    }
}

结果：

请注意，在您的图像中，看起来该框每180度暂停一次，因此我将该功能更改为仅旋转180度。由于盒子具有90度的径向对称性，它看起来仍然是一直到处，暂停在180度和360度。

如果您需要在没有任何径向对称的情况下为图像设置动画，则需要使用CAKeyframeAnimation来实现180度和360度的易用性。