Search code examples
iostransformcatransform3d

Can I do a half m34 transformation


I want to do a full rotation, but with an image swap half way through and I can't seem to be able to do that. The full rotation can be seen below. How can I make a half of this but with the nice z axis stuff? This is in a animateWithDuration block (iOS4)

// Create perspective transformation
CATransform3D transform = CATransform3DIdentity;
transform.m34 = 1.0f / -zDistance;
myView.layer.transform = transform; //- 3d
myView.layer.transform = CATransform3DMakeRotation(M_PI, -1, 0, 0); 

Solution

  • You can do this with two blocks:

    // Rotate the second 'backside' view to 90 degrees and hide it
    CATransform3D transform = CATransform3DIdentity;
    transform.m34 = 1.0f / -zDistance;
    mySecondView.layer.transform = transform;
    mySecondView.layer.transform = CATransform3DMakeRotation(M_PI / 2, -1, 0, 0);
    mySecondView.hidden = YES;
    
    // Animate to 90 degrees
    [UIView animateWithDuration:0.5 animations:^{
        CATransform3D transform = CATransform3DIdentity;
        transform.m34 = 1.0f / -zDistance;
        myView.layer.transform = transform;
        myView.layer.transform = CATransform3DMakeRotation(M_PI / 2, -1, 0, 0);
    
    } completion:^{
    
        // Switch to the backside view
        myView.hidden = YES;
        mySecondView.hidden = NO;
    
        // Animate the remaining 90 degrees
        [UIView animateWithDuration:0.5 animations:^{
            CATransform3D transform = CATransform3DIdentity;
            transform.m34 = 1.0f / -zDistance;
            mySecondView.layer.transform = transform;
            mySecondView.layer.transform = CATransform3DMakeRotation(M_PI, -1, 0, 0);
        }
    }
    

    You can also experiement with the myView.layer.isDoubleSided property, which hides the back of a view - although you will still need to toggle the hidden flag at the end of the animation otherwise the first view's buttons will still be clickable.

    Hope this helps! Thanks.