OpenGL ES 2.0 Android Alpha显示为黑色

2019年7月21日 282次阅读

我能够成功地将位图渲染到纹理上并在手机屏幕上显示它没问题.我想要做的是从它上面的PNG渲染另一个纹理.叠加层png包含一些透明(alpha)像素.

我可以在背景纹理图像上渲染叠加层,但是当我这样做时,透明像素看起来像是半透明的黑色？除非黑色实际上来自纹理背景,我将其设置为黑色…有没有人对我做错做什么或其他方式来实现这种理想的效果？

顶点着色器：

private final String vertexTextureShaderCode =
                "attribute vec4 aPosition;"+ // Position of out Vertex
                "attribute vec2 aTexPosition;"+ // Position of our texture contained in the vertex
                "varying vec2 vTexPosition;"+ //
                "void main(){"+
                "    gl_Position = aPosition;"+
                "    vTexPosition = aTexPosition;"+
                "}";

片段着色器：

private final String fragmentTextureShaderCode =
            "precision mediump float;" +
            "uniform sampler2D uTexture;" + // Our Background Image  ( Our uploaded image)
            "uniform sampler2D uOverlay;"+ // Our Ovrelay image
            "varying vec2 vTexPosition;" +
            "void main() {" +
            "  vec4 colImage = texture2D(uTexture,vTexPosition);" +
            "  vec4 colOverlay = texture2D(uOverlay, vTexPosition);"   +
            "  gl_FragColor = mix(colImage, colOverlay, 0.7);" +
            "}";

画框法

 public void drawOverlay(Context context,int resourceId){
    BitmapFactory.Options opts = new BitmapFactory.Options();
    opts.inScaled = false;

    Bitmap bitmap = BitmapFactory.decodeResource(context.getResources(), resourceId,opts);

    // Bind our TEXTURE_COORDS to the array
    GLES20.glBindTexture(GLES20.GL_TEXTURE_2D,mTexturePointer[1]);

    // Create the nearest filter TEXTURE_COORDS
    GLES20.glTexParameteri(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_MIN_FILTER, GLES20.GL_NEAREST);
    GLES20.glTexParameteri(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_MAG_FILTER, GLES20.GL_NEAREST);
    GLES20.glTexParameteri(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_WRAP_S, GLES20.GL_CLAMP_TO_EDGE);
    GLES20.glTexParameteri(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_WRAP_T, GLES20.GL_CLAMP_TO_EDGE);

    // Use Android GL Utils to specify a 2d TEXTURE_COORDS image from our bitmap
    GLUtils.texImage2D(GLES20.GL_TEXTURE_2D, 0, bitmap, 0);

    bitmap.recycle();

    GLES20.glBindFramebuffer(GLES20.GL_FRAMEBUFFER, 0);
    GLES20.glUseProgram(mProgram);

    // ENable bledning

//       GLES20.glEnable(GLES20.GL_BLEND);
//
//        // User SRC_OVE
//        GLES20.glBlendFunc(GLES20.GL_ONE, GLES20.GL_ONE_MINUS_SRC_ALPHA);

    // get handle to vertex shader vPosition member
    mPositionHandle = GLES20.glGetAttribLocation(mProgram, "aPosition");
    mTextureHandle = GLES20.glGetUniformLocation(mProgram, "uTexture");
    mTextureOverlayhandle = GLES20.glGetUniformLocation(mProgram, "uOverlay");
    mTexturePositionHandle = GLES20.glGetAttribLocation(mProgram, "aTexPosition");

    GLES20.glVertexAttribPointer(mTexturePositionHandle, 2, GLES20.GL_FLOAT, false, 0, mTextureBuffer);
    GLES20.glEnableVertexAttribArray(mTexturePositionHandle);

    // ACTIVATING OUR FIRST TEXTURE, I.E our background image.
    GLES20.glActiveTexture(GLES20.GL_TEXTURE0);
    GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, mTexturePointer[0]);
    GLES20.glUniform1i(mTextureHandle,0);

    // ACTIVATE OUR SECOND SECOND I.E our overlay
    GLES20.glActiveTexture(GLES20.GL_TEXTURE1);
    GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, mTexturePointer[1]);
    GLES20.glUniform1i(mTextureHandle,1);

    // Prepare the triangle coordinate data
    GLES20.glVertexAttribPointer(mPositionHandle, COORDS_PER_VERTEX, GLES20.GL_FLOAT, false, 0, vertexBuffer);

    // enable a handle to the triangle vertice
    GLES20.glEnableVertexAttribArray(mPositionHandle);

    // clear the colors
    GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT);

    GLES20.glDisable(GLES20.GL_DEPTH_TEST);

    GLES20.glEnable(GLES20.GL_BLEND);

    // User SRC_OVER
    GLES20.glBlendFunc(GLES20.GL_ONE, GLES20.GL_ONE_MINUS_SRC_ALPHA);
    // Draw the square
    GLES20.glDrawArrays(GLES20.GL_TRIANGLE_STRIP, 0, vertexCount);

    // Disbale the vertex array
    GLES20.glDisableVertexAttribArray(mPositionHandle);

}

在我的片段着色器中使用mix方法是否正确？我应该将2个图像绘制成1个纹理(sampler2D),而不是将混合用于2个sampler2D对象吗？如果是的话,我该怎么做呢.每次我尝试直接在背景纹理上绘制前景纹理.

最佳答案 好的,想出了我自己的问题.

我试图将2个不同的位图绘制到一个纹理,但是使用相同的纹理手柄来做到这一点.上面发布的片段着色器不符合此类结果.在2个纹理上使用“混合”不是正确的方法.

正确的方法是只使用1个纹理,但是我的背景纹理和前景纹理都有一个句柄.在draw()方法中,我首先设置背景图像,就像通常一样使用glDrawArrays(…),然后设置Foreground图像(使用正确的指针)用另一个glDrawArrays绘制前景图像(…)打电话.

点赞