用另一个动画打断 UIView 动画时移除延迟

Remove delay when interrupting UIView animation with another animation

我正在用另一个动画打断飞行中的动画。它工作正常,但在动画更改之前有明显的延迟。

当我在 动画到 5 后单击 重置为 1 时,顶部的正方形继续扩大一秒钟然后缩小。对于底部的正方形,我强制动画以 layer.removeAllAnimations() 停止,它立即缩小......但是,它从完整的 5 倍比例值而不是当前值开始。

这是我的代码:

class ViewController: UIViewController {
    
    let resetButton = UIButton(type: .system)
    let finishButton = UIButton(type: .system)
    
    let squareView = UIView(frame: CGRect(x: 100, y: 100, width: 30, height: 30))
    let referenceSquareView = UIView(frame: CGRect(x: 100, y: 100, width: 30, height: 30))
    let squareView2 = UIView(frame: CGRect(x: 100, y: 300, width: 30, height: 30))
    let referenceSquareView2 = UIView(frame: CGRect(x: 100, y: 300, width: 30, height: 30))
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        resetButton.frame = CGRect(x: 200, y: 80, width: 160, height: 20)
        finishButton.frame = CGRect(x: 200, y: 140, width: 160, height: 20)
        
        view.addSubview(resetButton)
        view.addSubview(finishButton)
        
        view.addSubview(referenceSquareView)
        view.addSubview(squareView)
        view.addSubview(referenceSquareView2)
        view.addSubview(squareView2)
        referenceSquareView.transform = CGAffineTransform(scaleX: 5, y: 5)
        referenceSquareView2.transform = CGAffineTransform(scaleX: 5, y: 5)
        
        squareView.backgroundColor = UIColor.blue
        referenceSquareView.backgroundColor = UIColor.red
        squareView2.backgroundColor = UIColor.blue
        referenceSquareView2.backgroundColor = UIColor.red
        
        resetButton.setTitle("Reset to 1", for: .normal)
        resetButton.setTitleColor(.blue, for: .normal)
        resetButton.addTarget(self, action: #selector(resetTo1(_:)), for: .touchUpInside)
        finishButton.setTitle("Animate to 5", for: .normal)
        finishButton.setTitleColor(.blue, for: .normal)
        finishButton.addTarget(self, action: #selector(animateTo5(_:)), for: .touchUpInside)
    }
    @objc func resetTo1(_ sender: UIButton!) {
        UIView.animate(withDuration: 3) {
            self.squareView.transform = CGAffineTransform(scaleX: 1, y: 1)
        }
        
        self.squareView2.layer.removeAllAnimations() /// removing animations for the bottom square
        UIView.animate(withDuration: 3) {
            self.squareView2.transform = CGAffineTransform(scaleX: 1, y: 1)
        }
    }
    @objc func animateTo5(_ sender: UIButton!) {
        UIView.animate(withDuration: 3) {
            self.squareView.transform = CGAffineTransform(scaleX: 5, y: 5)
        }
        
        self.squareView2.layer.removeAllAnimations() /// removing animations for the bottom square
        UIView.animate(withDuration: 3) {
            self.squareView2.transform = CGAffineTransform(scaleX: 5, y: 5)
        }
    }
}

有什么方法可以立即更改动画?

当您调用 self.squareView2.transform = CGAffineTransform(scaleX: 5, y: 5) 时,squareView2 立即具有变换值 5,无需等待 3 秒(即使您将持续时间更改为 3600 秒)。您在应用程序中看到的矩形大小增加的动画只是一个动画层。因此,如果您调用 removeAllAnimations,它会立即显示变换值为 5 的 squareView2。

要解决此问题,我认为您可以改用计时器。将标志 scale 设置为 1。然后,当您点击“Animate to 5”时,每 0.3 秒将 scale 增加 0.5。所以如果你想停止,只需使计时器无效并安排另一个计时器来减少 scale value