如何消除 animateKeyframes 动画开始和结束的延迟 - Swift UIKit

Posted 2023-03-13

【中文标题】如何消除 animateKeyframes 动画开始和结束的延迟 - Swift UIKit

【英文标题】：How to remove delay on start and end of animateKeyframes animation - Swift UIKit

【发布时间】：2020-11-24 14:39:59

【问题描述】：

有没有办法消除 animateKeyframes 动画开始和结束的延迟？

如您所见，动画开始前有一点延迟；点击Animate 按钮后以及动画结束时。我希望能够在点击Animate 按钮后立即启动动画，因为这是为了向用户提供反馈。

这是将animateKeyframes 动画与calculationModeCubic 一起使用时的正常行为吗？有没有办法让动画在点击按钮后立即开始？

对拼写错误感到抱歉 (Animate)。

代码如下：

@IBAction func startAnimation(_ sender: Any) 
    addMyView()
    
    UIView.animateKeyframes(withDuration: 3.0, delay: 0.0, options: [.calculationModeCubic], animations: 
        UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 0.2, animations: 
            self.myView!.center =  CGPoint(x: self.pointA.center.x, y: self.pointA.center.y)
        )
        UIView.addKeyframe(withRelativeStartTime: 0.2, relativeDuration: 0.2, animations: 
            self.myView!.center =  CGPoint(x: self.pointB.center.x + 55, y: self.pointB.center.y - 5 )
            self.myView!.transform = CGAffineTransform(scaleX: 0.75, y: 0.75)
        )
        
        UIView.addKeyframe(withRelativeStartTime: 0.4, relativeDuration: 0.2, animations: 
            self.myView!.center =  CGPoint(x: self.pointB.center.x, y: self.pointB.center.y)
            self.myView!.transform = CGAffineTransform(scaleX: 0.5, y: 0.5)
        )
    , completion:  _ in
        self.myView?.removeFromSuperview()
    )


func addMyView()
    myView = UIView(frame: CGRect(x: pointA.center.x - 25, y: pointA.center.y - 25, width: 50, height: 50))
    myView?.backgroundColor = .blue
    myView?.layer.cornerRadius = myView!.frame.height / 2
    view.addSubview(myView!)

【问题讨论】：

尝试在 .isHidden 设置为 true 的情况下设置样式并添加一次视图。然后在动画之前取消隐藏视图并重置其帧并在完成时重新隐藏它。

它是否可以与任何其他动画选项一起使用，例如calculationModeCubicPaced？

使用像这样将动画混合在一起的框架来获得精确的动画需要反复试验。为了清楚起见，您在点击按钮之前添加了子视图，然后在点击时取消隐藏，对吗？

您还可以将多个CATransaction 块串在一起并同时有效地执行它们。关键帧动画并不是实现这一目标的唯一方法。事实上，在同步动画多个事物时，我使用 CATransaction 比任何其他 API 更幸运。

CATransaction 与您现在正在做的事情一样简单，甚至更容易。但是你可能对关键帧动画有更多的运气。你只需要使用那个给你想要的东西。

【参考方案1】：

关键是不断调整withRelativeStartTime: 和relativeDuration: 参数。

@IBAction func startAnimation(_ sender: Any) 
    addMyView()
      UIView.animateKeyframes(withDuration: 1.5, delay: 0.0, options: [.calculationModeCubic], animations: 
        UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 0.2, animations: 
            self.myView!.center =  CGPoint(x: self.pointA.center.x, y: self.pointA.center.y)
        )
        UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.9, animations: 
            self.myView!.center =  CGPoint(x: self.pointB.center.x + 75, y: self.pointB.center.y - 50 )
            self.myView!.transform = CGAffineTransform(scaleX: 0.75, y: 0.75)
        )
        
        UIView.addKeyframe(withRelativeStartTime: 0.1, relativeDuration: 0.7, animations: 
            self.myView!.center =  CGPoint(x: self.pointB.center.x, y: self.pointB.center.y)
            self.myView!.transform = CGAffineTransform(scaleX: 0.3, y: 0.3)
        )
    , completion:  _ in
        self.myView?.removeFromSuperview()
    )