CAShapeLayer 路径弹簧动画不“过度”

Question

我正在尝试使用 CASpringAnimation 对 CAShapeLayer 路径进行动画处理。预期的结果是形状之间的“变形”，表现出“弹性”。

我有一个圆形和方形路径之间的基本代码示例，如下所示，但最终结果是一个弹簧动画，它不会“超出”最终的较大方形路径，这是预期的行为。

我的代码是：

let springAnimation = CASpringAnimation(keyPath: "path")
springAnimation.damping = 1
springAnimation.duration = springAnimation.settlingDuration
springAnimation.fromValue = standardCirclePath().cgPath
springAnimation.toValue = standardSquarePath().cgPath

circleLayer.add(springAnimation, forKey: nil) // Where circleLayer (red background) is a sublayer of a basic UIView in the frame (blue background)

我从这个答案中得到了我的道路。

有没有办法使用 CASpringAnimation 来实现 CAShapeLayer 路径转换？否则，还有什么替代方案？

Answer 1

你好，我一直在研究你的问题，这是我的结果，gif 上的故障是因为我的 gif 转换器非常糟糕

这是代码

class ViewController: UIViewController {

    @IBOutlet weak var animatableVIew: UIView!
    var isBall = false
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }
    @IBAction func startAnimation(sender: AnyObject) {

        isBall = !isBall

        let springAnimation = CASpringAnimation(keyPath: "cornerRadius")
        let halfWidth = animatableVIew.frame.width / 2
        let cornerRadius: CGFloat = isBall ? halfWidth : 0
        springAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseIn)
        springAnimation.fromValue = isBall ? 0 : halfWidth ;
        springAnimation.toValue = cornerRadius;
        springAnimation.damping = 7
        springAnimation.duration = springAnimation.settlingDuration
        animatableVIew.layer.cornerRadius = cornerRadius

        let springAnimation2 = CAKeyframeAnimation(keyPath: "transform.scale")
        springAnimation2.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear)
        springAnimation2.values = [1,0.9,1.4,0.8,1]
        springAnimation2.keyTimes = [ 0, (1 / 6.0), (3 / 6.0), (5 / 6.0), 1 ];
        springAnimation2.duration = springAnimation.settlingDuration * 0.5

        let groupSpringAnimation = CAAnimationGroup()
        groupSpringAnimation.animations = [springAnimation,springAnimation2]
        groupSpringAnimation.duration = springAnimation.settlingDuration
        groupSpringAnimation.beginTime = 0;
        animatableVIew.layer.addAnimation(groupSpringAnimation, forKey: "group")

    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

我希望这可以帮助你