android - OpenGL ES 2.0 Android Alpha 显示为黑色

Question

我能够成功地将位图渲染到纹理上并将其显示在手机屏幕上，没问题。我正在尝试做的是在它上面渲染来自 PNG 的另一个纹理。覆盖 png 包含一些透明(alpha)像素。

我可以让叠加层渲染在背景纹理图像之上，但是当我这样做时，透明像素似乎被渲染为半透明的黑色？除非黑色实际上来 self 设置为黑色的纹理背景...有没有人对我可能做错了什么或以其他方式实现这种预期效果有任何建议？

顶点着色器:

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;"+
                "}";

fragment 着色器:

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);

}

在我的 fragment 着色器中使用 mix 方法是正确的方法吗？我是否应该将 2 个图像绘制到 1 个纹理(sampler2D)中，而不是将混合用于 2 个 sampler2D 对象？如果是这样，我该怎么做。每次我尝试将前景纹理直接绘制在背景纹理上时。

Answer 1

好的，解决了我自己的问题。

我试图将 2 个不同的位图绘制到一个纹理上，但使用的是相同的纹理句柄。上面发布的 fragment 着色器不正确，无法获得此类结果。在 2 个纹理上使用“混合”不是正确的方法。

正确的方法是只使用 1 个纹理，但有一个背景纹理和前景纹理的句柄。在 draw() 方法中，我首先设置背景图像，就像通常一样并使用 glDrawArrays(...)，然后设置前景图像(使用正确的指针)以使用另一个 glDrawArrays 绘制前景图像(...) 调用。