How do I use keytimes in CAKeyFrameAnimation to animate the opacity of a layer?

Question

I am trying to animate a layer so that the opacity goes from 0 to 1 in about 0.2 seconds, keep the opacity at 1 for a second, and then put the opacity back at 0. I'm trying to use key times to do it, but I can't get it right.

CAKeyframeAnimation *opacityLabel = [CAKeyframeAnimation animationWithKeyPath: @"opacity"];

// 0.2 seconds fade in, 1 second hold, 0.2 seconds fade out
[opacityLabel setDuration: 1.4];
[opacityLabel setDelegate: self];
[opacityLabel setValue: @"countLabel" forKey: @"verify"];
[opacityLabel setValues: [NSArray arrayWithObjects: [NSNumber numberWithFloat: 1.0], [NSNumber numberWithFloat: 1.0], [NSNumber numberWithFloat: 0], nil]];
[opacityLabel setKeyTimes: [NSArray arrayWithObjects: [NSNumber numberWithFloat: 0.2], [NSNumber numberWithFloat: 1.2], [NSNumber numberWithFloat: 1.4], nil]];

[[tomorrowCountLabel layer] addAnimation: opacityLabel forKey: @"opacityUp"];

score 4 · Accepted Answer · answered Apr 13 '13 at 20:36

You are almost there. Key times should be values between 0 and 1. You can think of them as percentages. Also your animation should start at opacity 0 not 1. So here are the two lines you should change:

opacityLabel.values   = @[@0, @1, @1, @0];
opacityLabel.keyTimes = @[@0, @(0.2/1.4), @(1.2/1.4), @1];

How do I use keytimes in CAKeyFrameAnimation to animate the opacity of a layer?

1 Answers1