学习OpenGL ES for Android（八）

纹理不但可以和颜色叠加，纹理和纹理也可以叠加。纹理叠加时需要设置透明度，我们看下公式

 mix (x,y, a)：返回x和y的线形叠加。a的范围0-1，结果= x*(1-a) + y * a

 根据上篇文章的着色器代码，修改gl_FragColor为两个纹理的叠加

        vertexShaderCode =
                "uniform mat4 uMVPMatrix;" +
                        "attribute vec4 aPos;" +
                        "attribute vec2 aTextCoord;" +
                        "varying vec2 TextCoord;" +
                        "attribute vec3 aColor;" +
                        "varying vec3 ourColor;" +
                        "void main() {" +
                        "  gl_Position = uMVPMatrix * aPos;" +
                        "  ourColor = aColor;" +
                        "  TextCoord = aTextCoord;" +
                        "}";

        fragmentShaderCode =
                "precision mediump float;" +
                        "uniform sampler2D texture1;" +
                        "uniform sampler2D texture2;" +
                        "varying vec2 TextCoord;" +
                        "void main() {" +
                        "  gl_FragColor = mix(texture2D(texture1, TextCoord),texture2D(texture2, TextCoord),0.5);" +
                        "}";

这时就需要创建两个纹理了，

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig config) {
        super.onSurfaceCreated(gl, config);
        Bitmap bitmap1 = BitmapFactory.decodeResource(context.getResources(),
                R.drawable.image1);
        Bitmap bitmap2 = BitmapFactory.decodeResource(context.getResources(),
                R.drawable.image2);
        imageWH = (float) bitmap1.getWidth() / (float) bitmap1.getHeight();
        texture1 = OpenGLUtil.createTextureNormal(bitmap1);
        texture2 = OpenGLUtil.createTextureNormal(bitmap2);
        bitmap1.recycle();
        bitmap2.recycle();
    }

绘制时就需要传入两个纹理的索引，

    @Override
    public void onDrawFrame(GL10 gl) {
        super.onDrawFrame(gl);
        ……

        int textureHandle1 = GLES20.glGetUniformLocation(shaderProgram, "texture1");
        //GLES20.glUniform1i(textureHandle, 0);
        OpenGLUtil.bindTexture(textureHandle1, texture1, 0);
        int textureHandle2 = GLES20.glGetUniformLocation(shaderProgram, "texture2");
        //GLES20.glUniform1i(textureHandle, 0);
        OpenGLUtil.bindTexture(textureHandle2, texture2, 1);

        ……

    }

显示效果如下

因为两张图片的宽高比不同，而我们是用的第一张图片的宽高比为基准设置的，导致第二张图片有拉伸。想要避免这种情况，有两个方式，一是用两张宽高比相同的图片；二是修改第二张图片的纹理坐标。