0, preface

At the beginning, I came into contact with Matrix because I needed to do some processing on pictures. However, as a young man who just graduated from school for half a year, I did not even know Matrix at first. Later, I found out through various searching materials that Matrix was used to do some translation, rotation and scaling operations, which could not only apply to pictures. It also works on Rect, Point, etc. Then, there are some right and wrong information on the Internet, and it is not very detailed, which leads to the author stepping on a lot of pits in this process. This paper aims to help readers like the author who are not familiar with Matrix, or even have not used it, to understand Matrix in principle and make a summary for themselves.

1. What is Matrix?

Matrix, translated into Chinese, looks like this

[ 1 4 2 5 3 6 ]  


A matrix mathematically represents a set of linear equations, and those of you who have taken linear algebra know that. What? What if you haven’t? Don’t worry, this article only used matrix multiplication, will not involve deep knowledge of line generation.

2. Matrix multiplication

Matrix multiplication formula:

It might not be very intuitive to just look at the multiplication formula, but let’s see what happens when you multiply two 2 by 2 matrices

[ x 11 x 21 x 12 x 22 ] ∗[ y 11 y 21 y 12 y 22 ] =[ x 11 ∗y 11 +x 12 ∗y 21 x 21 ∗y 11 +x 22 ∗y 21 x 11 ∗y 12 +x 12 ∗y 22 x 21 ∗y 12 +x 22 ∗y 22 ]  


Let’s practice with a simple example

[ 0 1 1 2 ] ∗[ 1 2 2 4 ] =[ 2 5 4 10 ]  


How about that? It’s so easy. All right, that’s all for the prep work, and now we’re ready to get down to business.

Matrix in Android

Let’s take a look at the Matrix class on Android Developer

The Matrix class holds a 3×3 matrix for transforming coordinates.

You can see that Matrix is used for coordinate transformation. And it’s a 3 by 3 matrix. Just how long

⎡ ⎣⎢ M SC ALE _X M SK EW _Y M PE RS P_ 0 M SK EW _X M SC ALE _Y M PE RS P_ 1 M TRA NS _X M TRA NS _Y M PE RS P _2 ⎤ ⎦⎥ (Android Matrix)


The basic transformations that Matrix can operate can be divided into four types:


Scale: zoom


Skew: wrong cut


Rotate: rotating


Translate: translation

By the way, the three arguments in the last line are 0,0,1. It’s a fixed value, so why do you do that, why do you do nine things with six parameters? In fact, this online substitution is called the homogeneous equation, just to make it easy to calculate.

4. SetXXX, preXXX and postXXX in Matrix

What’s the difference between the three? SetXXX is the simplest, calling setXXX directly resets and assigns the Matrix. Pre and Post are not so simple, and there is no difference between pre and Post if only one transformation is used (why not? Leave a hole here. But when used in combination, the difference is huge. I used scale and Translate at the same time, and the journey began…

At the beginning, I searched online and found many blog posts that pre was implemented first and post was implemented later. For example, if I call postTransla first and then preScale, the system will perform scale first and then POST. First of all, the blog post does not make it clear what the difference is between executing first and executing later. Second, there is a problem with the logic here. We all know that code is executed line by line, and it is impossible to execute the next line and then go back to the previous line.

The first thing to note here is that pre is not executed first at all, and Post is not executed last at all. Pre and Post stand for left multiplication, respectively. And right times (back?) I don’t know why Google uses pre and Post. Before multiplying and after multiplying, left is front, right is back.

Take Translate, for example, as Google explains to postTranslate

postTranslate

boolean postTranslate (float dx, float dy)

Postconcats the matrix with the specified translation.

M prime is T dx dy times M

The back product puts itself behind, the front matrix times itself

PreTranslate similarly

M prime is M times T dx dy.

The front product puts itself in front, times the back matrix

Why there will be front multiplication, because the matrix does not conform to the commutative law of multiplication (except in special cases, such as: two matrices are exactly the same), matrix commutative multiplication will get different results, I suggest students to verify it.

Here again the way, the author thought forehearth is multiplied by a matrix in front, but this is the opposite of actual completely, then look at the API just know is wrong, so advocate people encounter problems must go to the website to find information, it must be the most authoritative, and Google China has returned to, isn’t it, don’t have to work hard over the wall, don’t look at when at this time.

5. Different results produced by preXXX and postXXX when using transformations in combination

Scale and Translate are used in this article, and other cases can be verified by students themselves

  • PreScale (Δ Δ X, Y)

⎡ ⎣⎢ S cale_X 0 0 0 S cale_Y 0 T ransla te_X T ranslate _Y 1 ⎤ ⎦⎥ ∗⎡ ⎣⎢ Δ X 0 0 0 Δ Y 0 0 0 1 ⎤ ⎦⎥



= ⎡ ⎣⎢ S cale_X ∗Δ X 0 0 0 S cale_Y ∗Δ Y 0 T ranslate _X T ran sla te_ Y 1 ⎤ ⎦⎥  



Conclusion: preScale(float x, float y) does not affect the original offset.

  • PostScale (Δ Δ X, Y)

⎡ ⎣⎢ Δ X 0 0 0 Δ Y 0 0 0 1 ⎤ ⎦⎥ ∗⎡ ⎣⎢ S cale_X 0 0 0 S cale_Y 0 T ranslate _X T ran sla te_ Y 1 ⎤ ⎦⎥



= ⎡ ⎣⎢ Δ X∗S cale_X 0 0 0 Δ Y∗S cale_Y 0 Δ X∗T ranslate _X Δ Y∗T ranslate _Y 1 ⎤ ⎦⎥  



Conclusion: postScale(float x, float y) scales the original offset together.

Earlier in this article, I poked a hole in the fact that pre and Post work identically when there is only one type transformation. When free scale, translate equals 0, so the results are the same.

  • PreTranslate (Δ Δ X, Y)

⎡ ⎣⎢ S cale_X 0 0 0 S cale_Y 0 T ransla te_X T ranslate _Y 1 ⎤ ⎦⎥ ∗⎡ ⎣⎢ 1 0 0 0 1 0 Δ X Δ Y 1 ⎤ ⎦⎥



= ⎡ ⎣⎢ S cale_X 0 0 0 S cale_Y 0 S cale_X ∗Δ X+T ranslate _X S cal e_Y ∗Δ Y +T ran sla te_ Y 1 ⎤ ⎦⎥  



Conclusion: preTranslate(float x, float y) scales the offset at the previous scaling ratio.

  • PostTranslate (Δ Δ X, Y)

⎡ ⎣⎢ 1 0 0 0 1 0 Δ X Δ Y 1 ⎤ ⎦⎥ ∗⎡ ⎣⎢ S cale_X 0 0 0 S cale_Y 0 T ranslate _X T ran sla te_ Y 1 ⎤ ⎦⎥



= ⎡ ⎣⎢ S cale_X 0 0 0 S cale_Y 0 T ranslate _X+Δ X T ranslate _Y +Δ Y 1 ⎤ ⎦⎥  



PostTranslate (float x, float y) will offset the specified value, regardless of the scaling parameter.

Similarly, when scale is equal to 1, preTranslate and postTranslate are the same.

I’m not going to prove any of the other transformations, but now that you know how it works, let’s try it out for ourselves.

6, the latter

This paragraph is to see the last children’s shoes, but also to myself. Google has already wrapped up the Api for developers to use, but it’s important to understand the principles when necessary, otherwise the road to ambiguity can be much more tortuous than if you were on the ground. This is not only a quality to have as a developer, but also a great asset in life.