Question

Now before you get all antsy, this is Cocoa I’m talking about, not Cocoa-Touch. With that out of the way, lets begin. I have recently started programming for the Mac. Why? Because it’s cool. You know what’s not cool? Not being able to have nice fancy animations like the other cool kids. I can’t figure this out and if you can help me you will save the few hairs I have left on my head.

Alright, I have a NSCollectionView. Took me ages to figure that out, but whatever. I’ve made that NSCollectionView layer-backed in Interface Builder. I heard that’s supposed to make this magic work. I tried this to animate my collection view:

//usersView is my NSCollectionView
CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform"];    
CATransform3D scale = CATransform3DMakeScale(2.0, 2.0, 0.0);
[anim setFromValue:[NSValue valueWithCATransform3D:CATransform3DIdentity]];
[anim setToValue:[NSValue valueWithCATransform3D:scale]];
[anim setDuration:1.0f];
[[usersView layer] addAnimation:anim forKey:nil];
[[usersView layer] setTransform:scale];

Now here’s the deal: it does transform the view, but not with a cool animation. I also tried this:

[CATransaction begin];
[CATransaction setValue:(id)kCFBooleanTrue forKey:kCATransactionDisableActions];
[CATransaction setValue:[NSNumber numberWithFloat:3.0f] forKey:kCATransactionAnimationDuration];
[usersView layer].transform = CATransform3DMakeScale(2.0, 2.0, 0.0);
[CATransaction commit];

No dice. I do believe I need help. Thanks.

Answer 1

I believe that for your second piece of code that attempts an implied animation (by assigning a new value for the transform property) you need to skip setting the kCATransactionDisableActions property to true since in effect that says not to animate the transition (which is exactly the opposite of your intention). To be explicit you could set that property to false. There could easily be some other issue at play too; I never seem to know exactly what’s needed until it’s coded and running. (With core animation I always find myself inching towards the result I want bit by bit. But after finally getting at least something to animate it really inspires me to continue tweaking the code till it works the way I want it!, i.e., core animation isn’t an easy one to pick up.)

As for the first problem, the explicit animation, I believe one problem has to do with the last line where you set the layer’s transform property; I’d start by leaving that out (though it may have to be worked back in someplace else in the long run). Setting that transform immediately changes the layer to how it should look when the animation is complete (which is why you see the transformation occur immediately) but that doesn’t completely explain not seeing any animation since the transaction (which begins once your code is complete, i.e., after the immediate transition has occurred) does have both a ‘start’ and an ‘end’ value. To start, I’d begin by finding some example code that does a similar animation and changing it piece by piece to get what you want. (That’s how I learned to use core animation after trying to completely code an animation by myself and having it fail; it did take a long time to get it right but I really got a better feeling for it in doing so.) You might also want to go back to the documentation and really try to get the concept of the core animation rendering architecture, i.e., the layer-tree, the presentation-tree and the render-tree and what is displayed at different stages of the animation as well as how to affect it (which again will really only sink in after a bunch of trial and error). Just stick with it till it makes sense!