Need better and simpler understanding of CATransform3D

Question

Please go through the images.

So this is the code which I got from some online source and it does transform my object. Besides that, I understood nothing at all. I am new to CATransform3D and want to know exactly how it works.

CATransform3D transform = CATransform3DIdentity;
transform.m34 = 1.0 / -500;
transform = CATransform3DRotate(transform, 45.0f * M_PI / 180.0f, 0, 1, 0.0f);
_bgView.layer.transform = transform;

I want to know how did this code run? Why did we set some value in m34? I found that its some kind of matrix which even confuses me more. Also, what do the arguments in the CATransform3DRotate mean???

I am trying to understand but not getting any further.

I want a deep understanding of CATransform3D. Please help with any articles, documentation or by explaining yourselves.

Thanks a lot.

Answer 1

I'm not sure what m34 is without looking.

A 2D rotation is easy because all it needs is an angle by which to rotate. The rotation is then done AROUND the Z axis (i.e. the axis that points directly out of the screen).

A 3D rotation is different. It needs an angle but also it needs to know which axis (or axes) you are rotating around.

In CATransform3DRotate you give it five parameters...

1. The transform that you want to apply the rotation to.

2. Angle (in radians) π radians = 180 degrees 3, 4 and 5 are how much of the angle rotation to apply to each axis.

3. X axis - this is the axis that goes from the left of the screen to the right of the screen.

4. Y axis - this is the axis that goes from the top of the screen to the bottom of the screen.
5. Z axis - this is the axis that points directly out of the screen straight towards you.

The rotation you have applied in your example is as follows...

angle = 45 degrees (converted into radians). X = 0 Y = 1 Z = 0

This means that all of the 45 degrees will be rotated around the Y axis. i.e. it will rotate like a revolving door around the line down its middle.

If you had the params... "1, 0, 0" at the end then it would rotate like a paddle boat paddle. "Falling away from you."

Finally if you had "0, 0, 1" it would spin like a catherine wheel on the screen.

You can also combine the values i.e. have "0, 1, 1" to apply rotation about two axes.

The w row of the matrix is the perspective projection. Did you ever do perspective drawing at school where you place a dot and draw lines from the dot and then draw things to fit those lines to give it perspective? Well the m34 value determines where that dot is placed and so provides perspective. Set it to something like -50 and you will see a bigger difference.

Setting m34 relates to the Z axis value of this point. So the point is placed at (0, 0, -1/500)

Answer 2

The m34 value is the third row, forth column and is the value in the matrix behind the transform that actually gives the rotation perspective.

You can read more about the math behind matrix multiplications on Wikipedia.

• Transformation matrix
• 3D Perspective

Regarding the values for CATransform3DRotate(...).

• The first argument is the transform that you are rotating
• The second is the angle (in radians),
• The other three arguments it's the axis you are rotating around ((x, y, z) vector).

Answer 3

Here is my project in Swift https://github.com/paulz/PerspectiveTransform that helps to calculate CATransform3D and includes Example app and playgrounds.

it can be used to animate CALayer transform property.

See wiki: https://github.com/paulz/PerspectiveTransform/wiki for details on constructing the matrix and other possible solutions.

Thank you for this question, it helped me to get started on my project knowing not only me have that problem!