Question

我有一个简单的游戏，使用三个透明部分的纹理。我可以看到我的纹理的轮廓，但是没有alpha设置为零的任何地方都会返回黑色（0,0,0,1）。

这是我的片段着色器：

precision mediump float;

// our texture
uniform sampler2D u_image0;
uniform sampler2D u_image1;
uniform sampler2D u_image2;

// the texCoords passed in from the vertex shader.
varying vec2 v_texCoord;

void main() {
// Look up a color from the texture.
vec4 textureColor = texture2D(u_image0, v_texCoord);
    if (textureColor.a < 0.5) 
        discard;
    else
        gl_FragColor = vec4(textureColor.rgb, textureColor.a);

vec4 textureColor1 = texture2D(u_image1, v_texCoord);
    if (textureColor1.a < 0.5) 
        discard;
    else
        gl_FragColor = vec4(textureColor1.rgb, textureColor1.a);

vec4 textureColor2 = texture2D(u_image2, v_texCoord);
    if (textureColor2.a < 0.5) 
        discard;
    else
        gl_FragColor = vec4(textureColor2.rgb, textureColor2.a);

我得到条件，从另一个问题测试alpha，其中alpha为零的像素被设置为白色。解决了我的问题，但不确定它是否适当缩放到多个纹理。我很确定我做错了。

先谢谢，如果我需要添加更多代码（顶点着色器等），请告诉我。

Answer 1

我不清楚你实际上想要实现的目标。你编写这段代码的方式让我觉得你不知道discard语句实际上做了什么：它完全丢弃了片段，着色器的当前调用将立即中止。

如果3个纹理的任何的alpha值低于0.5，那么着色器所做的只是丢弃整个片段。您在丢弃之前写入gl_FragCoord这一事实并不重要。如果所有纹理的某些alpha都高于0.5，则最终颜色将为u_image2。

WebGL程序中的片段着色器将纹理中的所有颜色设置为黑色

1 个答案: