Question

我有一个UIImageView我要旋转180度，占用1秒钟，然后我想在这个位置等待1秒钟，然后旋转180度回到原来的位置需要1秒钟。

我如何做到这一点？我已经尝试了100种方法，它不断向后退，而不是向后旋转

编辑：我忘记添加我需要这个无限重复

Answer 1

您可以在UIView.animate上显示的completionHandler中执行第二个动画

let duration = self.transitionDuration(using: transitionContext)

let firstAnimDuration = 0.5
UIView.animate(withDuration: firstAnimDuration, animations: {
    /* Do here the first animation */
}) { (completed) in

   let secondAnimDuration = 0.5
   UIView.animate(withDuration: secondAnimDuration, animations: { 
       /* Do here the second animation */
   })
}

现在你可能有另一个问题。

如果使用CGAffineTransform旋转视图，并且每个动画都为view.transform指定了此类型的新对象，则将丢失先前的变换操作

所以，根据这篇文章：How to apply multiple transforms in Swift，您需要连接转换操作

包含2个动画块的示例

这是一个旋转180并在1秒后返回原点的例子：

let view = UIView.init(frame: CGRect.init(origin: self.view.center, size: CGSize.init(width: 100, height: 100)))
view.backgroundColor = UIColor.red
self.view.addSubview(view)

var transform = view.transform
transform = transform.rotated(by: 180)

UIView.animate(withDuration: 2, animations: {
    view.transform = transform
}) { (completed) in

    transform = CGAffineTransform.identity
    UIView.animate(withDuration: 2, delay: 1, options: [], animations: { 
        view.transform = transform
    }, completion: nil)
}

.repeat动画和.autoreverse

的示例

.animate方法可让您设置一些动画选项。特别是结构UIViewAnimationOptions包含：

.repeat，无限重复你的动画块
.autoreverse，将您的视图恢复到原始状态

考虑到这一点，你可以这样做：

var transform = view.transform.rotated(by: 180)
UIView.animate(withDuration: 2, delay: 0, options: [.repeat, .autoreverse], animations: {
     self.myView.transform = transform
})

但是你需要在两个动画之间延迟，所以你需要这样做：

递归动画示例和延迟1秒

只需在ViewController中创建一个方法，为视图设置动画。在最后的completionHandler中，只需调用该方法来创建一个无限循环。

最后，您需要在viewDidAppear上调用该方法来启动动画。

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)

    self.animation()
}


func animation() {
    var transform = view.transform
    transform = transform.rotated(by: 180)

    UIView.animate(withDuration: 2, delay: 0, options: [], animations: {

        self.myView.transform = transform

    }) { bool in
        transform = CGAffineTransform.identity

        UIView.animate(withDuration: 2, delay: 1, options: [], animations: {

            self.myView.transform = transform

        }, completion: { bool in
            self.animation()
        })
    }
}

Answer 2

您需要做的就是创建一个keyFrame animations。它旨在将多个动画链接在一起，并在第一个关键帧中将UIImageView子类按PI旋转，然后在第二个关键帧中将其转换回identity。

        let rotateForwardAnimationDuration: TimeInterval = 1
        let rotateBackAnimationDuration: TimeInterval = 1
        let animationDuration: TimeInterval = rotateForwardAnimationDuration + rotateBackAnimationDuration

        UIView.animateKeyframes(withDuration: animationDuration, delay: 0, options: [], animations: { 
            UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: rotateForwardAnimationDuration) {
                self.imageView.transform = CGAffineTransform(rotationAngle: .pi)
            }

            UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: rotateBackAnimationDuration) { 
                self.imageView.transform = .identity 
            }
        })

<强>结果：

修改这是一个如何使其无限运行的示例。我想你的图像是在viewController中，并且你对imageView持有一些引用。

例如，在viewDidAppear上，调用触发动画的函数，而不是动画的完成块，只需再次调用相同的函数。

class ViewController: UIViewController { @IBOutlet weak var imageView: UIImageView! override func viewDidAppear(_ animated: Bool) { super.viewDidAppear(animated) self.runRotateAnimation() } func runRotateAnimation() { let rotateForwardAnimationDuration: TimeInterval = 1 let rotateBackAnimationDuration: TimeInterval = 1 let animationDuration: TimeInterval = rotateForwardAnimationDuration + rotateBackAnimationDuration UIView.animateKeyframes(withDuration: animationDuration, delay: 0, options: [], animations: { UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: rotateForwardAnimationDuration) { self.imageView.transform = CGAffineTransform(rotationAngle: .pi) } UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: rotateBackAnimationDuration) { self.imageView.transform = .identity } }) { (isFinished) in // To loop it continuosly, just call the same function from the completion block of the keyframe animation self.runRotateAnimation() } } }

如何在

2 个答案:

包含2个动画块的示例

.repeat动画和.autoreverse

递归动画示例和延迟1秒