iosuiviewxcode6catransform3drotate

Rotate views as a cube with CATransform3DRotate vertically instead of horizontally?


This is when I wish I would have paid more attention in my math courses. By looking at some example code I have been able to make a cube using UIviews which I can swipe left and right. The following code is to rotate my views to the left. Here The UIviews are view and view2 below.

float rotation = (percent*90.0);
float fProject = (pc_width_page/2.0)*sinf(toRadians(rotation));
view.layer.transform = CATransform3DRotate(CATransform3DTranslate(t, 0.0, 0.0, -1.0*(fProject)), toRadians(rotation), 0.0, 1.0, 0.0);
view.center = CGPointMake((self.frame.size.width/2.0)+fProject, floorf(self.frame.size.height/2.0));
//View2
rotation = (percent*90.0)+90.0;
fProject = (pc_width_page/2.0)*sinf(toRadians(rotation));
view2.layer.transform = CATransform3DRotate(CATransform3DTranslate(t, 0.0, 0.0, -1.0*(fProject)), toRadians(rotation+180), 0.0, 1.0, 0.0);
view2.center = CGPointMake((self.frame.size.width/2.0)-fProject, floorf(self.frame.size.height/2.0));

Now my question is, what should I be modifying here to make the same animation but up or down instead of rotating them left. I have tried to change it myself as I understand that there is both a translation and a rotation being done to the layer but I am not getting the results I expect. Any help would be appreciated.


Solution

  • According to the reference, CATransform3DRotate takes as an input a CATransform3D object, the angle, and the x,y,z component of the rotation vector.

    CATransform3D CATransform3DRotate ( CATransform3D t, CGFloat angle, CGFloat x, CGFloat y, CGFloat z );
    

    The rotation vector is allways perpendicular to the rotation ellipse, so if you want a rotation that moves in the y and z axis (vertical rotation), your rotation vector is (x,y,z) = (1.0,0.0,0.0).

    Since the projection is performed in the z-axis in both cases (horizontal and vertical rotation) this CATransform3D object can be maintained.

    And concerning the center, the projection then should applied to the vertical coordinate. So the modified example is the following:

    float rotation = (percent*90.0);
    float fProject = (pc_height_page/2.0)*sinf(toRadians(rotation));
    view.layer.transform = CATransform3DRotate(CATransform3DTranslate(t, 0.0, 0.0, -1.0*(fProject)), toRadians(rotation), 1.0, 0.0, 0.0);
    view.center = CGPointMake(floorf(self.frame.size.width/2.0), (self.frame.size.height/2.0) - fProject);
    

    Given that pc_width_pageis a factor value for controlling the rotation projection, it will be coherent to relate this value to the vertical dimension (height).

    I hope this helps you.