CoreAnimation — 层在动画开始前闪烁到最终值？

Question

我正在尝试对图层的背景颜色从红色到蓝色执行一个简单的 CABasicAnimation。

添加动画并设置模型层的最终值后，动画闪烁为蓝色，然后再次变为红色，然后变为蓝色。

我的代码是：

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

    // Create red layer and add to view
    let redLayer = CALayer()
    redLayer.backgroundColor = UIColor.red.cgColor
    redLayer.position = view.center
    redLayer.bounds.size = CGSize(width: 100, height: 100)
    view.layer.addSublayer(redLayer)

    DispatchQueue.main.asyncAfter(deadline: .now() + .seconds(1)) {

        // After a 1 second delay, animate from red to blue.

        let anim = CABasicAnimation(keyPath: "backgroundColor")
        anim.duration = 3
        anim.fromValue = redLayer.backgroundColor
        anim.toValue = UIColor.blue.cgColor
        redLayer.add(anim, forKey: "")

        // Set background color to final value
        redLayer.backgroundColor = UIColor.blue.cgColor
    }
}

这里发生了什么？

Answer 1

简短的回答是，当您更新图层的隐式动画属性（在本例中为 backgroundColor）时，您将获得隐式动画。

这个 0.25 秒的动画优先于您的显式动画，因为它是在之后添加的。发生这种隐式动画是因为层是 "standalone"（也就是说；它不属于视图）。

要摆脱这种隐式动画，您可以创建一个 CATransaction 并仅针对更新图层属性:

的范围禁用操作

CATransaction.begin()
CATransaction.setDisableActions(true)

redLayer.backgroundColor = UIColor.blue.cgColor

CATransaction.commit()

作为禁用隐式动画的替代方法，您还可以在添加显式动画之前更新图层。如果您想了解更多信息，我对在添加动画之前或之后更新图层的含义有相当详细的解释 in this answer。

CoreAnimation — 层在动画开始前闪烁到最终值？

CoreAnimation — Layer flickers to final value before animation starts?

core-animation

calayer

cabasicanimation

ios