Applying the same perspective and rotation to all CALayer elements (unlike Coverflow)

Question

I'm trying to simulate the look of CDs in a shelf. Each CD should be visible from an angle very much like books when you look at a book shelf. I use core animation transformations. The problem is that the result looks like Coverflow, i.e. the elements look different based on their position on the screen.

Here a screenshot of what it actually looks like and what I want it to look like:

I used CALayers and applied two basic transformations:

1) To rotate:

CATransform3DMakeRotation(DegreesToRadians(60), 0, 1, 0);

2) To add the perspective:

CATransform3D perspective = CATransform3DIdentity;
perspective.m34 = -1.0/400;
self.layer.sublayerTransform = perspective;

How can I apply the same transformation to all layers and have them all look alike? Is Core Animation the right tool for the job?

Thanks, Mark.

Answer 1

Try including the perspective transform in the individual elements’ transform, rather than in the parent layer’s sublayerTransform:

CATransform3D perspective = CATransform3DIdentity;
perspective.m34 = -1.0/400;
CATransform3D transform = CATransform3DRotate(perspective, DegreesToRadians(60), 0, 1, 0);
element.layer.transform = transform;