Crops the image distorted when the texture rotates along the Z axis

Question

Hi, I am developing an Android application based on OpenGLES, and I need to rotate the texture along the z axis in real time. But the image is distorted when I add rotation to the model matrix.

The first image below is original, and the second is a skewed image after rotation along the z axis.

Here are my shaders:

private final String mVertexShader = "" +
        "attribute vec4 position;\n" +
        "attribute vec2 textureCoordinate;\n" +
        "varying vec2 textureCoordinateVarying;\n" +
        "uniform mat4 modelMat;\n" +
        "uniform mat4 viewMat;\n" +
        "uniform mat4 projectionMat;\n" +
        "" +
        "void main() {\n" +
        "    gl_Position = projectionMat * viewMat * modelMat*position ;\n" +
        "    textureCoordinateVarying = textureCoordinate;\n" +
        "}";
private final String mFragmentShader = "precision highp float;\n" +
        "uniform sampler2D textureBackground;\n" +
        "uniform sampler2D textureNumbers;" +
        "varying highp vec2 textureCoordinateVarying;\n" +
        "void main() {\n" +
        "    vec4 background = texture2D(textureBackground, textureCoordinateVarying);" +
        "    vec4 foreground = texture2D(textureNumbers, textureCoordinateVarying);" +
        "    gl_FragColor = mix(background, foreground, 0.2);\n" +
        "}\n";

And with respect to projection, the matrix of representations and models, here is their init function:

    Matrix.setIdentityM(model, 0);
    Matrix.setIdentityM(rotation, 0);
    Matrix.setIdentityM(view, 0);
    Matrix.setIdentityM(projection, 0);

    Matrix.translateM(view, 0,0,0,-3.0f);
    Matrix.perspectiveM(projection,0,45,(float)mBackground.getHeight()/(float)mBackground.getWidth(), 0.1f, 100f);

And in the onDraw function, I will update the value of the model matrix;

public void onDrawFrame(GL10 gl) {
    //some function

    //update model matrix, and rotation is just a 4*4 identity matrix, and the degree is the z-axis rotation degree.
    Matrix.setRotateM(rotation, 0, degree, 0, 0, 1);
    Matrix.multiplyMM(model, 0, rotation, 0, model, 0);
    Matrix.setIdentityM(rotation,0);

    //draw my texture
}

Now I am very desperate, any help would be greatly appreciated.

Answer 1

, , , , , / .