如何制作连续翻转动画？

我一直在试图创建一个模拟投掷硬币的动画。这是我目前使用的，但是每个动画执行之间有一个小小的延迟，我不认为UIView.transition是实现它的最佳方式。如何制作连续翻转动画？

var duration: CGFloat = 0.25 
var imageIndex = 1 
var repeatCount = 0 

@objc func handleSpin() 
{ 
    let options: UIViewAnimationOptions = .transitionFlipFromLeft 

    UIView.transition(with: self.coinImageView, duration: TimeInterval(duration), options: options, animations: nil) { (completed) in 

     if self.repeatCount == 10 
     { 
      self.duration = 0.25 
      self.imageIndex = 1 
      self.repeatCount = 0 
      return 
      //animation done 
     } 
     else 
     { 
      self.coinImageView.image = UIImage(named: self.imageNames[self.imageIndex]) 
      self.duration += 0.075 
      self.repeatCount += 1 
      self.imageIndex = self.imageIndex == self.imageNames.count - 1 ? 0 : self.imageIndex + 1 
      self.handleSpin() 
     } 
    }

该函数自己调用10次，每次都会增加一点动画持续时间。但正如我所说的那样，问题在于我想要修复的每次执行之间有一点点延迟。

我也试图与CATransition，并将其添加到ImageView的像这样的层：

func flipAnimation() 
{ 
    let animation = CATransition() 
    animation.type = "flip" 
    animation.startProgress = 0 
    animation.endProgress = 0.5 
    animation.subtype = "fromLeft" 
    animation.duration = 0.5 
    animation.repeatCount = 0 

    self.layer.add(animation, forKey: "animation") 
}

这里的问题是，我不能让图像保持翻转，因为它恢复到当动画完成时默认，而且我不知道如何跟踪动画何时完成。

有没有第三个更好的方法呢？

编辑：我应该提到，我也尝试过使用Spring库，但它有与CATransition相同的问题;当动画完成后，图像恢复到正常状态，我找不到任何防止这种情况的方法。

来源

2017-10-08 Elhoej

添加您想要的动画样本以及您从代码中获得的动画。 –

好的，我会尽快上传一段短片。 – Elhoej

检查答案https://stackoverflow.com/a/22549926/2963352 – vivek

你可以尝试动画关键帧，这也许会更好看：

extension UIView { 
    func startAnimatingFlip(with duration: TimeInterval) { 
     UIView.setAnimationCurve(.linear) 
     UIView.animateKeyframes(withDuration: duration/2, delay: 0, options: .beginFromCurrentState, animations: { 
      UIView.setAnimationCurve(.linear) 
      UIView.addKeyframe(withRelativeStartTime: duration/2, relativeDuration: 0.5, animations: { 
       self.transform = CGAffineTransform(scaleX: -1, y: 1) 
      }) 
      UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: 0.5, animations: { 
       self.transform = CGAffineTransform(scaleX: 1, y: 1) 
      }) 
     }) { _ in 
      self.startAnimatingFlip(with: duration) 
     } 
    } 
}

当然，你必须把它调整到您的需要。但就动画而言，关键帧之间似乎没有任何延迟。

来源

2017-10-08 09:09:06

如何制作连续翻转动画？

回答

相关问题