Question

I’m trying this code (found in an answer here on SO) in a category on UIView and am using it to peform a “pop” animation on a UIImageView nested inside of a UITableViewCell.

- (void)attachPopUpAnimation
{
    CAKeyframeAnimation *animation = [CAKeyframeAnimation
       animationWithKeyPath:@"transform"];

    CATransform3D scale1 = CATransform3DMakeScale(0.5, 0.5, 1);
    CATransform3D scale2 = CATransform3DMakeScale(1.2, 1.2, 1);
    CATransform3D scale3 = CATransform3DMakeScale(0.9, 0.9, 1);
    CATransform3D scale4 = CATransform3DMakeScale(1.0, 1.0, 1);

    NSArray *frameValues = [NSArray arrayWithObjects:
       [NSValue valueWithCATransform3D:scale1],
       [NSValue valueWithCATransform3D:scale2],
       [NSValue valueWithCATransform3D:scale3],
       [NSValue valueWithCATransform3D:scale4],
       nil];
    [animation setValues:frameValues];

    NSArray *frameTimes = [NSArray arrayWithObjects:
         [NSNumber numberWithFloat:0.0],
         [NSNumber numberWithFloat:0.5],
         [NSNumber numberWithFloat:0.9],
         [NSNumber numberWithFloat:1.0],
         nil];    
    [animation setKeyTimes:frameTimes];

    animation.fillMode = kCAFillModeForwards;
    animation.removedOnCompletion = NO;
    animation.duration = 0.2;

    [self.layer addAnimation:animation forKey:@"popup"];
}

The animation works properly, but when it finishes, it disappears. I’ve found answers to others with this problem, but apparently setting the fillMode will not work in this instance.

Answer 1

Don’t use those two lines. Instead actually set the transform on the layer. Replace these two lines:

animation.fillMode = kCAFillModeForwards;
animation.removedOnCompletion = NO;

with the final transform state:

[[self layer] setTransform:scale4];

When setting fill mode forwards and not removing the animation, it is causing the final state to be visual only. You need to actually change the layer’s internal state for the property you’re animating. To do so, override the animation for the transform property by using the transform name when adding the animation to the layer. This will cause the animation to use your animation instead of the default.

[[self layer] addAnimation:animation forKey:@"transform"];