CABasicAnimation autoreverse twice as fast

Question

I'm using this code to add pulsing circle with autoreverse:

let scaleAnimation = CABasicAnimation(keyPath: "transform.scale")        
scaleAnimation.duration = 6
scaleAnimation.repeatCount = 200
scaleAnimation.autoreverses = true
scaleAnimation.fromValue = 0.1
scaleAnimation.toValue = 0.8
scaleAnimation.timingFunction = CAMediaTimingFunction(controlPoints: 0.42, 0.0, 0.58, 1.0)
animationView.layer.add(scaleAnimation, forKey: "scale")

What I would like to do here is to:

Run animation fromValue = 0.1 toValue = 0.8 at 2x speed, and go backwards animating it fromValue = 0.8 toValue = 0.1 at 1x speed.

Is there an easy way to achieve this?

Have you tried a `CAKeyframeAnimation`? – clemens Oct 28 '16 at 17:19 — clemens, Oct 28 '16 at 17:19

score 1 · Accepted Answer · answered Oct 28 '16 at 22:38

You have two ways of doing this:

CAKeyframeAnimation (best choice for you):

Designed specifically for animating a single keyPath with multiple keyframes, with custom timeFunctions on each interval. Just what you need

let scaleAnimation = CAKeyframeAnimation(keyPath: "transform.scale")
scaleAnimation.duration = 18 // 6 seconds for the first part, 12 for the second
scaleAnimation.repeatCount = 200
scaleAnimation.values = [0.1, 0.8, 0.1] // make sure first and last values are equal in order to get seamless animation
scaleAnimation.keyTimes = [0, 0.333, 1] // keyframes scaled to [0; 1] interval
scaleAnimation.timingFunctions = [
    CAMediaTimingFunction(controlPoints: 0.42, 0.0, 0.58, 1.0), //first interval
    CAMediaTimingFunction(controlPoints: 0.58, 0.0, 0.42, 1.0)  //second interval (reversed)
]
layer.add(scaleAnimation, forKey: nil)

CAAnimationGroup (kind of workaround)

Designed to group animations (perhaps with different keyPaths) for a single layer

let scaleUpAnimation = CAKeyframeAnimation(keyPath: "transform.scale")
//setup first animation as you did

let scaleDownAnimation = CAKeyframeAnimation(keyPath: "transform.scale")
//setup second animation

let groupAnimation = CAAnimationGroup()
groupAnimation.animations = [scaleUpAnimation, scaleDownAnimation]
//setup group if needed
layer.add(groupAnimation, forKey: nil)

thanks! helped me a lot. I used `CAAnimationGroup` to solve my problem. Btw, is there a way to get callbacks on each animation start? I tried with `CAAnimationDelegate`, but it only provides start/stop callbacks for the group itself and not the animations inside the group. — klaudas, Oct 30 '16 at 14:23

CABasicAnimation autoreverse twice as fast

1 Answers1