Matrix4 matrix changes
Serialized: Flutter layout -1-column Serialized: flutter layout -2-row serialized: flutter layout -3-center serialized: flutter layout -4-container
This is the transformation matrix, 16 parameters in total or you could view it as a 4 by 4 matrix. Specific parameters are as follows:
-Leonard: Scale and transform. Mobile rotationZ: Z axis rotate rotationX: X axis rotate rotationY: Y axis rotate the columns: compose: setting up a new matrix composite translation, rotation, scaling, and form a new state copy: copy a tensor (matrix) of 4 * 4Copy the code
4 * 4 matrix:
Matrix4(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
Copy the code
Matrix4. Diagonal3Values (2, 10, 1)
Matrix4. Diagonal3Values (1, 1, 1) shows the proportion of scaling, respectively along the x, y, z three directions, the x axis is to the right, y axis is down, and the z axis is from the screen up, during the said positive, > 1 said amplifier, less than 1 is greater than 0 to shrink, reverse negative said.
The red box is 80 in width and height, and the small box inside is 30 in width and height, so the zoom time can better reflect the relative position of the two. Specific use method or value, you can carefully look at the picture above. The z-axis changes can not be seen on the flat phone. We can see the z-axis changes in detail when we do rotation later.
Scaling can be written in the following ways: For example, zoom in x by a factor of 2.
Matrix4.diagonal3Values(2, 1, 1)
Matrix4.diagonal3(v.Vector3(2, 1, 1))
Matrix4.diagonal3(v.Vector3.array([2, 1, 1]))
- Matrix4(2, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 1, 0, 0, 0, 0, 1) all represent 30 units of movement in the positive x direction. Import ‘package:vector_math/vector_math_64.dart’ as v; The fourth is a 4*4 matrix notation: the first, sixth and eleventh values of the matrix respectively represent the X-axis scaling, Y-axis scaling and z-axis scaling
2. Transform: Move
Represents the translation distance, respectively along x, Y and Z directions, x axis is moving to the right, Y axis is moving down,z axis is moving up from the screen, positive value represents forward movement, negative value represents negative movement, where the z-axis movement cannot be seen in the plane
Move can be written as follows: For example, move 30 units to the right.
Matrix4.translationValues(30, 0, 0)
Matrix4.translation(v.Vector3(30, 0, 0))
Matrix4.translation(v.Vector3.array([0, -30, 0]))
- Matrix4(1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 1, 0, 30, 0, 0, 1) all represent 30 units of movement in the positive x direction. Import ‘package:vector_math/vector_math_64.dart’ as v; The fourth is written as a 4*4 matrix: the 13th, 14th and 15th values of the matrix respectively represent the X-axis translation, Y-axis translation and z-axis translation
3. RotationZ: Rotation about the Z-axis
It’s rotating around the Z axis, clockwise in the positive direction, anticlockwise in the negative direction, so it’s rotating in the positive direction from the x axis to the y axis
Two ways to write it:
- Matrix4.rotationz (PI / 6), parameter is radians
- Matrix4(cos(PI / 6), sin(PI / 6), 0, 0,-sin(PI / 6), cos(PI / 6), 0, 0, 0, 1, 0, 0, 0, 0, 0, 1), and the parameter is radians. So you change the values of 1, 2, 5, and 6 where 1 and 6 are the same as cosine 2 and 5 are the opposite of 2 sines, 5 is minus sine
4. RotationX: Rotation about the X-axis
It’s rotating around the X axis, clockwise in the positive direction, counterclockwise in the negative direction, so it’s rotating in the positive direction from the y axis to the z axis
Two ways to write it:
- Matrix4.rotationx (PI / 6), parameter is radians
- Matrix4(1, 0, 0, 0, 0, cos(PI / 6), sin(PI / 6), 0, 0, -sin(PI / 6), cos(PI / 6), 0, 0, 0, 0, 1), parameter is radians. So you change the matrix of 6, 7, 10, 11, 6 cosine PI over 6, 7 sine PI over 6, 10 minus sine PI over 6, 11 cosine PI over 6
5. RotationY: Rotation about the Y axis
On the left side of the gray size is the original shape Blue is the shape of the Y axis rotate 30 ° The red dotted line is projected a dotted line Red solid line is the rotation in the x, y plane is on the phone's screen projection of 0-90 is the rotation Angle, the greater the final on a mobile phone is smaller, the projection of 90 ° of time is a line, line and point is infinitesimal, is invisible to the naked eye, So you have 90 degrees where there's nothing there. If you want to see 90 degrees, change the Angle to 178* PI /180, and a line will appearCopy the code
It’s rotating around the Y axis, clockwise in the positive direction, counterclockwise in the negative direction, so it’s rotating in the positive direction from the x axis to the z axis
Two ways to write it:
- Matrix4.rotationy (PI / 6), parameter is radians
- Matrix4(cos(PI / 6), 0, -sin(PI / 6), 0, 0, 1, 0, 0, sin(PI / 6), 0, cos(PI / 6), 0, 0, 0, 0, 1), parameter is radians. So you change the matrix of 1, 3, 9, 11, 1 cosine PI over 6, the value of 3 – sine PI over 6, the value of 9 sine PI over 6, the value of 11 cosine PI over 6
Columns: Set a new matrix
Matrix4.columns(
v.Vector4(1, 0, 0, 0),
v.Vector4(0, 1, 0, 0),
v.Vector4(0, 0, 1, 0),
v.Vector4(0, 0, 0, 1))
Copy the code
Import ‘package:vector_math/vector_math_64.dart’ as v;
Each of the four parameters is a 4-dimensional vector, which is a 1-dimensional array of 4 values. It has the same effect as setting the Matrix4(1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1) directly
7, compose: composite translation, rotation, scaling, forming a new state
Matrix4.columns(
Vector3 translation,
Quaternion rotation,
Vector3 scale)
Copy the code
The first translation parameter is the three-dimensional vector v.vector3 (30,0,0), which represents a 30-unit shift to the right affecting the 13, 14, and 15 values of the matrix. The second parameter is a 4-dimensional vector, which can also be called a quaternion in the rotation to calculate the rotation. Quaternion and Euler Angle can be converted to each other. The parameters affecting the matrix are 1, 2, 3, 5, 6, 7, 9, 10 and 11, which means that these parameters affect the rotation. As can be seen from the rotation rotationxyz above:
The X-axis rotation affects the parameters 6, 7, 10, 11 the Y-axis rotation affects the parameters 1, 3, 9, 11 and the Z-axis rotation affects the parameters 1, 2, 5, 6
The third parameter is a three-dimensional vector: the scaled, influence matrix 1, 6, 11.
So scaling is related to rotation, and as you can see from the rotated image above,
The method of calculation is to calculate the translation parameters and the rotation of the four elements, and then scale
8, copy: copy a 4*4 tensor
Matrix4.copy( Matrix4(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1) )
Copy the code
9. Identity: Restore the initial state, namely the 4*4 identity matrix
Matrix4.identity()
Copy the code
May I know what the inverted matrix is
You go east, you go west
May I know what the difference is between the inverted distance and the inverted distance between the inverted distance and the inverted distance between the inverted distance and the inverted distance between the inverted distance and the inverted distanceCopy the code
May BE inverted(Matrix4(2, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1))? That's all coordinates *0.5Copy the code
Examples of 6,7,8,9,10 are as follows:
Outer (merge), Skew (warp), skewX(x-warp), skewY(y-warp), Zero (zero matrix), fromList(convert a 16-bit one-dimensional array into a 4-by-4 matrix)
* outer Merge the product of two 4-dimensional vectors * skew: skew * skewX: skew along the X-axis * skewY: skew along the Y-axis * Zero: a 4-by-4 tensor with all zeros * fromList: Converts a 16-bit one-dimensional array into a 4-by-4 matrixCopy the code