I first 3D rotate a flat figure in Illustrator or Photoshop, get the exact angles(x, y and z) applied to it in the design tool and then apply the same angles to a UILabel placed on top of the image to synchronize them visually.
I've figured out how to rotate 2 axis at the same time by using CATransform3DConcat but then I'm not sure how to apply the third.
float angleX = -18 * M_PI / 180;
CATransform3D t1 = CATransform3DMakeRotation(angleX, 1, 0, 0);
float angleY = -26 * M_PI / 180;
CATransform3D t2 = CATransform3DMakeRotation(angleY, 0, 1, 0);
CATransform3D combo1 = CATransform3DConcat(t1, t2);
self.labelPlay.layer.transform = combo1;
EDIT
Trying this now but still no good. Tried all combinations of different orders but nothing.
float angleX = -18 * M_PI / 180;
CATransform3D t1 = CATransform3DMakeRotation(angleX, 1, 0, 0);
float angleY = -26 * M_PI / 180;
CATransform3D t2 = CATransform3DMakeRotation(angleY, 0, 1, 0);
float angleZ = 8 * M_PI / 180;
CATransform3D t3 = CATransform3DMakeRotation(angleZ, 0, 0, 1);
self.label.layer.transform = CATransform3DConcat(CATransform3DConcat(t3, t2), t1);
These rotations are called precession, nutation, and intrinsic rotation.
3) Rotation about the z-axis: In this kind of rotation, the object is rotated parallel to the z-axis (principal axis), where the z coordinate remains unchanged and the rest of the two coordinates x and y only change.
In this position, the X is Axial, Y is Radial Horizontal and the Z is Radial Vertical.
Right-click the UCS icon, and click Rotate Axis. Click X, Y, or Z. As you drag the cursor, the UCS rotates in the positive direction around the specified axis. You can also specify a rotation angle.
I'm not entirely sure but I think this might be it.
For designers thinking angles from 3D rotation in Illustrator/Photoshop would just work with CATransform3D, it's almost true but you might have to change one tiny thing.
Let's say you have x : -18, y : -26 and z : 8 in your design tool. Switching y and z to positive/negative solved my problem. So now I have -
float angleX = -18 * M_PI / 180;
CATransform3D t1 = CATransform3DMakeRotation(angleX, 1, 0, 0);
float angleY = 26 * M_PI / 180;
CATransform3D t2 = CATransform3DMakeRotation(angleY, 0, 1, 0);
float angleZ = -8 * M_PI / 180;
CATransform3D t3 = CATransform3DMakeRotation(angleZ, 0, 0, 1);
self.label.layer.transform = CATransform3DConcat(CATransform3DConcat(t1, t2), t3);
I can't tell you why exactly but this rotates properly.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With