Problem with challenge: individual vs group animations


When adding an opacity animation that is approximately synchronized with the bounce, I’ve encountered a failure I don’t understand. Basically, if I add the two animations individually, things works as expected (bounce and fade approximately synchronized). If, however, I put the two animations in a group and add the group, the animation does not behave as I would expect at all. Pertinent code below (with group animation code commented out):

    // create a keyframe bounce animation
    CAKeyframeAnimation *bounce = [CAKeyframeAnimation animationWithKeyPath:@"transform"];
    [bounce setDelegate:self];
    // create the values it will pass through
    CATransform3D forward = CATransform3DMakeScale(1.3, 1.3, 1);
    CATransform3D back = CATransform3DMakeScale(0.7, 0.7, 1);
    CATransform3D forward2 = CATransform3DMakeScale(1.2, 1.2, 1);
    CATransform3D back2 = CATransform3DMakeScale(0.9, 0.9, 1);
    [bounce setValues:[NSArray arrayWithObjects:
                       [NSValue valueWithCATransform3D:CATransform3DIdentity],
                       [NSValue valueWithCATransform3D:forward],
                       [NSValue valueWithCATransform3D:back],
                       [NSValue valueWithCATransform3D],
                       [NSValue valueWithCATransform3D:back2],
                       [NSValue valueWithCATransform3D:CATransform3DIdentity],
    // set duration
    [bounce setDuration:2.0];
    // create a keyframe opacity animation
    CAKeyframeAnimation *wink = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];
    [wink setDelegate:self];
    // create the values it will pass through
    [wink setValues:[NSArray arrayWithObjects:
                     [NSNumber numberWithFloat:1.0],
                     [NSNumber numberWithFloat:0.1],
                     [NSNumber numberWithFloat:0.8],
                     [NSNumber numberWithFloat:0.1],
                     [NSNumber numberWithFloat:0.8],
                     [NSNumber numberWithFloat:1.0],
    // set duration
    [wink setDuration:2.0];

    // animate by adding individually (this apparently works)
    [[timeLabel layer] addAnimation:bounce forKey:@"bounceAnimation"];
    [[timeLabel layer] addAnimation:wink forKey:@"winkAnimation"];
    //    // animate by adding group (this does not work)
    //    CAAnimationGroup *anGroup = [CAAnimationGroup animation];
    //    [anGroup setAnimations:[NSArray arrayWithObjects:bounce, wink, nil]];
    //    [anGroup setDelegate:self];
    //    [[timeLabel layer] addAnimation:anGroup forKey:@"bounceAndWinkAnimationGroup"];

Why does the group animation not behave as expected?



I think you need to add a duration for the group as well




Thanks, Gareth - that was the problem.