为什么 Alpha 混合渐变纹理会在 OpenGL ES 2.0 中产生意想不到的结果？答案

【问题标题】：Why does alpha blending gradient textures yield unexpected results in OpenGL ES 2.0?为什么 Alpha 混合渐变纹理会在 OpenGL ES 2.0 中产生意想不到的结果？
【发布时间】：2023-03-14 04:00:01
【问题描述】：

我有一个径向渐变纹理 (RGBA)，从中心完全不透明的黑色到边缘完全透明的颜色：

我使用最近使用 GLKit 的 OpenGL 模板设置了一个 iOS 项目。我添加了纹理功能，并在 setupGL 方法中设置了以下代码：

glEnable(GL_DEPTH_TEST);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);

当我在白色背景上的正交投影中重叠其中两个纹理（每个都有一个单独的 z）时，我希望是这样的：

但是我得到了这个：

我的问题很简单：为什么？ OpenGL ES 2.0 的混合不能达到这个效果吗？（我之前在 OpenGL ES 1.1 中已经让它工作了）我缺少一个常见的东西吗？这可能是我的纹理的预乘 alpha 问题吗？如果是这样，我的 PNG 或我加载它的方式会不会有些奇怪？我正在使用 GLKTextureLoader 加载纹理。

很可能我错了，但我知道这不可能是着色器问题，因为 alpha 混合发生在它到达片段着色器之前。我的着色器只是直接传递信息。（也许这是个问题？）

顶点着色器：

attribute vec4 position;
attribute vec2 texCoordIn;

varying vec2 texCoordOut;

uniform mat4 modelViewProjectionMatrix;

void main()
{
    gl_Position = modelViewProjectionMatrix * position;
    texCoordOut = texCoordIn;
}

片段着色器：

varying lowp vec2 texCoordOut;
uniform sampler2D texture;

void main()
{
    gl_FragColor = texture2D(texture, texCoordOut);
}

我也尝试如下设置 glBendFunc，但得到相同的结果：

glBlendFunc(GL_ONE, GL_ONE_MINUS_SRC_ALPHA);

欢迎任何提示或常见的挂断。谢谢！

【问题讨论】：

标签： ios opengl-es opengl-es-2.0

【解决方案1】：

如果glBlendFunc(GL_ONE, GL_ONE_MINUS_SRC_ALPHA) 和glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA) 产生相同的结果，那么您的纹理具有1.0 的统一alpha。因此，您将获得相当于添加剂混合的结果，并给出您显示的结果。如果出现任何情况，您是在预乘 alpha，然后将 alpha 通道扔掉。

所以要检查的显而易见的事情是 (i) 磁盘上的文件； (ii) 你的纹理加载代码。如果您不要求 GLKTextureLoaderApplyPremultiplication （无论如何这不应该影响您的 alpha 通道；大概您是直接从磁盘加载的？）那么怀疑会落在 (i) 上，尽管您直接包含在上面的图像似乎动作正确。

混合发生在片段着色器之后。为了进一步调试问题，您可以尝试丢弃其余信息，例如，将 alpha 通道中的值作为 alpha = 1.0 的红色通道传递。

【讨论】：

这里有一些优点，但没有什么能让我成功（还）。我已经检查并仔细检查了我的源 PNG，它似乎是正确的。我没有足够的经验知道这是否是加载问题。您提到在片段着色器之后发生混合......这怎么可能？到那时，碎片不只是被简化为没有“分层”（实际上）信息的单一颜色吗？
从片段着色器中输出 RGBA；然后根据当前混合函数将该值与帧缓冲区中已经存在的任何内容相结合。您可能没有输出正确的 alpha 值吗？
如您所见，我直接从 texture2D 函数输出。是否需要做一些处理而不是直接通过？
不，通过应该可以。虽然故意调换频道仍然是一个聪明的临时调试举措。

【解决方案2】：

好吧，我是个白痴。实际发生的是我的顶点的一个简单问题。我使用一个 glDrawArrays 调用一次绘制所有纹理，但我忘记在矩形之间添加额外的顶点来创建退化三角形。所以基本上第三个球在中心被压扁。但它看起来像一个 alpha 混合问题！

大笨蛋，就在这里。

【讨论】：