How does Apple do the Animation of the iBooks 2 flashcards?

Question

I'm trying to transition from one UIView to another by using

[UIView transitionFromView:self.frontsideCardView 
                    toView:self.backsideCardView 
                  duration:kFlipCardAnimationDuration
                   options:UIViewAnimationOptionTransitionFlipFromTop
                completion:completion];

The problem is that the animation becomes laggy when I turn on CALayer shadows and rounded corners on the two views. So I looked around the Apple apps to see if they did something similar and I found that the iBooks 2 app does. You can learn flashcards there and if you tap a cards, it flips over smoothly. And from what I can see, they also use rounded corners and shadows.

What I noticed was that in my animation, the views fade to black while flipping - in iBooks this does no happen:

(for the example I removed everything from the view, otherwise it's just animating at 10 fps)

Any ideas what Apple did to create such a smooth animation?

Answer 1

They're using images painted on plain old views I'd bet. Simplest, fastest way to do it.

Answer 2

There is an example that pertains to swiping in Lion that you can probably adapt for your use: https://developer.apple.com/library/mac/samplecode/PictureSwiper. Basically, you take a picture of the pages before and after yours, put them in layers in a hidden view that is on top of yours, and then show the view and animate the layers during swiping. When swiping is complete, you hide the view and recache the images. This whole process will probably easier to implement in ios than osx.