如何在OpenGL中显示立方体的背景颜色以及两个纹理的颜色

Question

我正在尝试将两个纹理添加到 3d 立方体。我实现了我的目标，但在途中我失去了背景颜色。

我想显示图像的原始颜色以及背景颜色。我使用混合，但它显示的背景完全黑暗。

这就是我的 fragmentShaderCode 的样子：

private final String fragmentShaderCode =
        "precision mediump float;" +
                "uniform sampler2D u_Texture0;" +
                "uniform sampler2D u_Texture1;" +
                "uniform vec4 aColor;" +
                "varying vec2 v_TexCoordinate0;" +
                "varying vec2 v_TexCoordinate1;" +
                "void main() {" +
                "   vec4 base = texture2D(u_Texture0, v_TexCoordinate0);" +
                "   vec4 overlay = texture2D(u_Texture1, v_TexCoordinate1);" +
                "   mediump float ra = (overlay.a) * overlay.r + (1.0 - overlay.a) * base.r;" +
                "   mediump float ga = (overlay.a) * overlay.g + (1.0 - overlay.a) * base.g;" +
                "   mediump float ba = (overlay.a) * overlay.b + (1.0 - overlay.a) * base.b;" +
                "   gl_FragColor = vec4(mix(aColor.rgb, vec4(ra, ga, ba, 1.0).rgb , vec4(ra, ga, ba, 1.0).a), 1.0);" +
                "}";

Answer 1

vec4(ra, ga, ba, 1.0) 的 alpha 通道是 1.0。因此vec4(ra, ga, ba, 1.0).a 的结果总是1.0。

您需要使用纹理的 Alpha 通道。例如：max(base.a, overlay.a):

vec3 textureColor = vec3(ra, ga, ba);
float textureAlpha = max(base.a, overlay.a);
gl_FragColor = vec4(mix(aColor.rgb, textureColor, textureAlpha), 1.0); 

---

通过将纹理颜色与mix 函数混合来简化代码：

void main() {
    vec4 base = texture2D(u_Texture0, v_TexCoordinate0);
    vec4 overlay = texture2D(u_Texture1, v_TexCoordinate1);
    vec3 textureColor = mix(base.rgb, overlay.rgb, overlay.a);
    float textureAlpha = max(base.a, overlay.a);
    gl_FragColor = vec4(mix(aColor.rgb, textureColor, textureAlpha), 1.0); 
}