如何为 swift 中的 borderColor 变化设置动画

Question

出于某种原因，这对我不起作用：

let color = CABasicAnimation(keyPath: "borderColor")
color.fromValue = sender.layer.borderColor;
color.toValue = UIColor.redColor().CGColor;
color.duration = 2;
color.repeatCount = 1;
sender.layer.addAnimation(color, forKey: "color and width");

我没有让任何动画发生。

Answer 1

您必须使用相同的键名。您还忘记了在为图层设置动画之前为其添加边框宽度和颜色。像这样尝试：

let color = CABasicAnimation(keyPath: "borderColor")

@IBAction func animateBorder(sender: AnyObject) {
    color.fromValue = UIColor.greenColor().CGColor
    color.toValue = UIColor.redColor().CGColor
    color.duration = 2
    color.repeatCount = 1
    sender.layer.borderWidth = 2
    sender.layer.borderColor = UIColor.greenColor().CGColor
    sender.layer.addAnimation(color, forKey: "borderColor")
}

Answer 2

我不知道为什么，但出于某种原因调用：

color.fromValue = sender.layer.borderColor

不起作用。颜色没有被正确读取或什么的。我将其更改为：

let color = CABasicAnimation(keyPath: "borderColor");
color.fromValue = UIColor.greenColor().CGColor;
color.toValue = UIColor.redColor().CGColor;
color.duration = 2;
color.repeatCount = 1;
sender.layer.addAnimation(color, forKey: "color and width");

然后事情开始按预期进行。

Answer 3

我为此创建了 Swift 4 功能扩展 CALayer，您可以将开始和结束 UIColor 传递给它以及动画的持续时间：

extension CALayer {

func animateBorderColor(from startColor: UIColor, to endColor: UIColor, withDuration duration: Double) {
    let colorAnimation = CABasicAnimation(keyPath: "borderColor")
    colorAnimation.fromValue = startColor.cgColor
    colorAnimation.toValue = endColor.cgColor
    colorAnimation.duration = duration
    self.borderColor = endColor.cgColor
    self.add(colorAnimation, forKey: "borderColor")
}

请注意，要使其正常工作，您应该已经设置了 borderWidth，然后调用 animateBorderColor:

yourView.layer.borderWidth = 1.5
yourView.layer.animateBorderColor(from: UIColor.green, to: UIColor.red, withDuration: 2.0)

Answer 4

Swift 4 UIView 分机：

extension UIView {
  func animateBorderColor(toColor: UIColor, duration: Double) {
    let animation = CABasicAnimation(keyPath: "borderColor")
    animation.fromValue = layer.borderColor
    animation.toValue = toColor.cgColor
    animation.duration = duration
    layer.add(animation, forKey: "borderColor")
    layer.borderColor = toColor.cgColor
  }
}

然后只需编写即可使用它：

myView.animateBorderColor(toColor: .red, duration: 0.5)

Answer 5

(Swift 5, Xcode 11, iOS 13)

对于任何想同时更改边框颜色和宽度的人来说，以下代码对我很有效，动画看起来非常流畅。也许其他人知道将两者合二为一的方法？

let borderColorAnimation: CABasicAnimation = CABasicAnimation(keyPath: "borderColor")
borderColorAnimation.fromValue = layer.borderColor
borderColorAnimation.toValue = toColor.cgColor
borderColorAnimation.duration = animationDuration
layer.add(borderColorAnimation, forKey: "borderColor")
layer.borderColor = toColor.cgColor

let borderWidthAnimation: CABasicAnimation = CABasicAnimation(keyPath: "borderWidth")
borderWidthAnimation.fromValue = layer.borderWidth
borderWidthAnimation.toValue = toWidth
borderWidthAnimation.duration = animationDuration
layer.add(borderWidthAnimation, forKey: "borderWidth")
layer.borderWidth = toWidth

如何为 swift 中的 borderColor 变化设置动画

How to animate borderColor change in swift

swift

cabasicanimation