java - LibGDX - 如何在单个着色器中渲染具有不同比例的两个纹理？

Question

我正在尝试使用与另一个纹理不同的比例缩放在 FBO 中生成的纹理，并在片段着色器中同时渲染这两个纹理，以便我可以将它们混合在一起。

我关注了this tutorial为我的游戏生成光照贴图，我得到了一个完美的光照贴图，但我想在着色器中转换光照贴图，以便背景中的视差对象接收按比例缩放的光照贴图，以便它们与光源的“3D”距离似乎不影响他们的照明，但他们的 2D 距离会。

关于如何做到这一点，我最好的猜测是根据视差对象的 Z 距离在适当的位置缩放光照贴图。我游戏中的 Z 距离与物体到相机的 2D 距离成正比。

以下示例描述了常规光照贴图会发生什么以及所需的效果。此处的光照贴图由黄色径向渐变组成，位于右侧的黄色非视差“太阳”处:

Description of lightmap scaling

Animated example of current lighting

Animated example of intended lighting

通常在我的游戏中，我通过在 LibGDX 中像这样缩放连接到 SpriteBatch 的相机来缩放视差对象:

Array<Something> objects = new Array<Something>();
SpriteBatch batch = new SpriteBatch();
OrthographicCamera camera = new OrthographicCamera(screenWidth, screenHeight);

//{start loop, add objects, run logic, etc.}
...

for(int i=0;i<objects.size;i++){
   camera.zoom = objects.get(i).z;
   camera.update();
   batch.setProjectionMatrix(camera.combined);
   objects.get(i).sprite.draw(batch);
}

根据我的研究，应该有一种方法可以在顶点着色器中执行这些类型的转换。通过默认的 LibGDX 顶点着色器进行这样的变换很简单，它被设置为将顶点位置与相机的变换矩阵相乘，如下所示:

void main() {
    v_color = a_color;
    v_texCoords = a_texCoord0; 

    gl_Position =  u_projTrans * a_position; 
}

但我不确定当转换绑定(bind)到共享顶点位置时，我如何才能只缩放片段着色器中使用的两个纹理之一。作为引用，这里是从教程中实现的片段着色器:

void main() {
    vec4 diffuseColor = texture2D(u_texture, v_texCoords);

    vec2 lightCoord = (gl_FragCoord.xy / resolution.xy);
    vec4 light = texture2D(u_lightmap, lightCoord);

    vec3 ambient = ambientColor.rgb * ambientColor.a;
    vec3 intensity = ambient + light.rgb;
    vec3 finalColor = diffuseColor.rgb * intensity;

    gl_FragColor = v_color * vec4(finalColor, diffuseColor.a);
}

我认为这与变换纹理坐标而不是位置并将它们传递给光照贴图而不是使用屏幕分辨率来获取纹理坐标有关，但我这样做的尝试最终变得一团糟，因为我对 OpenGL ES 2 或 GLSL 不是很了解或没有经验。

是否有一种好的方法可以在两个纹理片段着色器中以不同于另一个的方式缩放一个纹理？还是有更好的方法来实现我想用光照贴图做的事情？

编辑:

因此，我可以通过为每个视差对象以不同的比例重新创建 FBO 光照贴图来完成我正在尝试做的事情，但这会为我的目标平台之一 (Android) 带来巨大的性能问题。

我找到了 some links这表明我正在尝试做的事情是可能的，但它们都描述了将两个不同的纹理坐标传递给顶点着色器，这似乎不适用于 SpriteBatch。是否可以在顶点着色器中转换纹理坐标，以便我可以将光照贴图的转换坐标传递给片段着色器？还是我误解了纹理坐标的工作原理？

Answer 1

首先，以防万一我假设 Something 代表单个 Sprite 是正确的:每次调用 batch.setProjectionMatrix() 时， Sprite 批处理被刷新，导致另一个绘制调用，如果你有超过几十个 Sprite ，这将太多了。使用将对象数组发送到 sprite 批处理的方法，您应该按 z 位置对它们进行排序，然后仅在自上次调用 batch.draw()。我个人会为每个视差层保留一个单独的对象数组，以保持简单而不用担心排序。

从那里开始:首先，在绘制您的光照贴图时，将您的游戏支持的最小缩放比例进行绘制，这样您就不必缩小您的光照贴图并冒着显示光照贴图裁剪边缘的风险。因此，在 fbo.begin() 之后，请确保您的 cam.zoom 已更改为场景的最小 cam.zoom。

要获得缩放的光照贴图坐标，您需要在顶点着色器中计算它并将其传递给片段着色器。首先，您需要输入的缩放级别，因此您需要将其作为制服传入。你可以这样做:

//including the changes explained way above, where objectLayers is an 
//Array<LayerWrapper>, where LayerWrapper contains a zoom value and 
//an Array<Something>
for(int i=0;i<objectLayers.size;i++){
    LayerWrapper layer = objectLayers.get(i);
    Array<Something> layerObjects = layer.objects;

    camera.zoom = layer.zoom;
    camera.update();
    batch.setProjectionMatrix(camera.combined);

    //update the zoom level in the shader you're using with the sprite batch
    customShader.bind();
    customShader.setUniformf("u_zoom", layer.zoom);

    for(Something object : layerObjects ){
        object.sprite.draw(batch);
    }
}

然后更新您的顶点着色器以声明 uniform float u_zoom; 和 varying vec2 v_lightCoords;。您的灯光坐标将根据缩放比例放大。只要我们传递一个变化，我们也应该预先计算精确的纹理坐标，这样你就不必在片段着色器中执行它，这会导致依赖纹理读取(优化可能是在开始的教程中完成)。

顶点着色器现在看起来像这样:

void main()
{
    v_color = a_color;
    v_texCoords = a_texCoord0;
    vec4 screenSpacePosition = u_projTrans * a_position;
    gl_Position =  screenSpacePosition;

    v_lightCoords = (screenSpacePosition.xy * u_zoom) * 0.5 + 0.5;
}

由于 v_lightCoords 已经内置了纹理坐标，您可以简化片段着色器来进行纹理查找，如下所示: vec4 Light = texture2D(u_lightmap, v_lightCoords);并删除不再需要的 uniform vec2 resolution;。