CATransaction setting animation duration not working

Question

I am learning Core Animation and trying out sample examples.

When I use the following code, the animation duration works

@implementation ViewController

- (void)viewDidLoad
{
[super viewDidLoad];

//Modifying base layer
self.view.layer.backgroundColor = [UIColor orangeColor].CGColor;
self.view.layer.cornerRadius = 20.0;
self.view.layer.frame = CGRectInset(self.view.layer.frame, 20, 20);

//Adding layer
mylayer=[CALayer layer]; //mylayer declared in .h file
mylayer.bounds=CGRectMake(0, 0, 100, 100);
mylayer.position=CGPointMake(100, 100); //In parent coordinate
mylayer.backgroundColor=[UIColor redColor].CGColor;
mylayer.contents=(id) [UIImage imageNamed:@"glasses"].CGImage;

[self.view.layer addSublayer:mylayer];
}


- (IBAction)Animate //Simple UIButton
{
[CATransaction begin];

// change the animation duration to 2 seconds
[CATransaction setValue:[NSNumber numberWithFloat:2.0f] forKey:kCATransactionAnimationDuration];

mylayer.position=CGPointMake(200.0,200.0);
mylayer.zPosition=50.0;
mylayer.opacity=0.5;

[CATransaction commit];
}
@end

On the other hand, if I lumped the Animate method code at the bottom of the ViewDidLoad button so that it happens without pressing any buttons, the animation duration is not respected. I just see the final result without any animation.

Any thoughts?

Thanks KMB

Answer 1

Here's the information you're missing: there are two layer hierarchies in your app. There's the model layer hierarchy, which you normally operate on. Then there's the presentation layer hierarchy, which reflects what's on the screen. Take a look at “Layer Trees Reflect Different Aspects of the Animation State” in the Core Animation Programming Guide for a bit more information, or (highly recommended) watch the Core Animation Essentials video from WWDC 2011.

All of the code you wrote operates on the model layer (as it should).

The system adds implicit animations when it copies a changed animatable property value from a model layer to the corresponding presentation layer.

Only model layers that are in a UIWindow's view hierarchy get presentation layers. The system sends you viewDidLoad before it has added self.view to the window, so there are no presentation layers for self.view or your custom layer yet when viewDidLoad is running.

So one thing you need to do is change the property later, after the view and the layer have been added to the window and the system has created the presentation layers. The viewDidAppear: is late enough.

- (void)viewDidLoad {
    [super viewDidLoad];

    //Modifying base layer
    self.view.layer.backgroundColor = [UIColor orangeColor].CGColor;
    self.view.layer.cornerRadius = 20.0;
    self.view.layer.frame = CGRectInset(self.view.layer.frame, 20, 20);

    // Adding layer
    mylayer = [CALayer layer]; //mylayer declared in .h file
    mylayer.bounds = CGRectMake(0, 0, 100, 100);
    mylayer.position = CGPointMake(100, 100); //In parent coordinate
    mylayer.backgroundColor = [UIColor redColor].CGColor;
    mylayer.contents = (id)[UIImage imageNamed:@"glasses"].CGImage;    
    [self.view.layer addSublayer:mylayer];
}

- (void)viewDidAppear:(BOOL)animated {
    [super viewDidAppear:animated];

    [CATransaction begin]; {
        [CATransaction setAnimationDuration:2];
        mylayer.position=CGPointMake(200.0,200.0);
        mylayer.zPosition=50.0;
        mylayer.opacity=0.5;
    } [CATransaction commit];
}