CATransform3D rotate causes half of image to disappear

Question

I'm using the following code to rotate an image, but half the image (down the y-axis) that has been rotated "out of" the page, disappears. How to fix? heading is in radians.

    CALayer *layer = myUIImageView.layer;
    CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
    rotationAndPerspectiveTransform.m34 = 1.0 / 500;
    rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, heading, 0.0f, 1.0f, 0.0f);
    layer.transform = rotationAndPerspectiveTransform;

Indeed this seems to mess with the z-index. This UIImageView is part of a UIView that is partially "behind" another UIView, but after rotation, the myUIImageView is always drawn on top. — iPadDeveloper2011, Feb 19 '11 at 06:13

score 33 · Accepted Answer · edited May 23 '17 at 10:31

33

The solution to this was to set the zPosition property of all my layers appropriately. Thanks is due to @Brad Larson, who suggested this solution in a comment here. It seems that, when you start using CATransform3D, the normal zindex view hierarchy established by addsubview is thrown out the window.

edited May 23 '17 at 10:31

Community

1
1

answered Feb 21 '11 at 00:22

iPadDeveloper2011

4,230
1
23
35

score 5 · Answer 2 · answered May 20 '11 at 22:57

5

  layer.anchorPoint = CGPointMake(0.0, 0.0);

answered May 20 '11 at 22:57

Liam Donaghy

51
1
1

score 0 · Answer 3 · answered Jul 24 '12 at 08:55

Setting the anchorPoint to {0.0, 0.0} works as well (as Liam already pointed out).

Here's the full code snippet for changing the anchorPoint without changing the layer's position on screen:

     layer.anchorPoint = CGPointMake( 0.0, 0.0 );

     CGPoint position = layer.position;
     CGSize size = layer.bounds.size;

     CGFloat posX = position.x - size.width / 2.0;
     CGFloat posY = position.y - size.height / 2.0;

     layer.position = CGPointMake( posX, posY );

CATransform3D rotate causes half of image to disappear

3 Answers3

Linked