LibGDX 如何使用 Sprites 和 SpriteBatch 在单个位置组合 2 个纹理以进行多纹理处理

Question

使用 LibGDX，我编写了一个非常简单的（也是我的第一个）片段着色器，它有两个不同的纹理集，第一个是要绘制到屏幕上的图像，第二个是alpha 透明蒙版。这是片段着色器：

#ifdef GL_ES
    precision mediump float;
#endif

varying vec4 v_color;
varying vec2 v_texCoords;
uniform sampler2D u_texture;
uniform sampler2D u_mask;

void main() {
    vec4 texColor = texture2D(u_texture, v_texCoords);
    vec4 maskColor = texture2D(u_mask, v_texCoords);
    gl_FragColor = vec4(
        vec3(v_color * texColor),
        maskColor.a
    );
}

u_texture 是要绘制的图像，u_mask 是带有透明度信息的纹理。

然而，我真正想做的是利用 Sprite 和 TextureAtlas 类来引用着色器的几个 TextureRegion 实例。这是我的渲染代码：

shaderBatch.setProjectionMatrix(camera.combined);
shaderBatch.begin();

// ... some housekeeping code ...

Sprite overlapAlphaMask = maskTextureAtlas.createSprite("mask", 4);
Sprite overlapSprite = spriteTextureAtlas.createSprite("some-tile", 8);
// Or some other index in the texture atlas

overlapAlphaMask.getTexture().bind(1);
alphaMaskShader.setUniformi("u_mask", 1);

overlapSprite.getTexture().bind(0);
alphaMaskShader.setUniformi("u_texture", 0);

shaderBatch.draw(overlapSprite, worldX, worldY, 1.0f, 1.0f);

虽然这至少是运行并渲染了一些东西，但它从 maskTextureAtlas 中拾取了错误的纹理区域。我的猜测是这里还有更多事情要做，因为着色器不会对 overlapAlphaMask 精灵有任何了解——如何绘制它，纹理坐标是什么，等等。

我假设 SpriteBatch.draw() 方法负责从传入的 overlapSprite 中获取正确的信息，所以我希望着色器中的 vec2 v_texCoords正确设置以绘制它，但这些坐标对于第二个纹理/sampler2D uniform 属性是错误的。这是我第一次尝试使用着色器，所以我确定我缺少一些基本的东西！

---更新---

到目前为止，我的谷歌搜索显示我可能需要通过顶点着色器设置更多内容。我正在使用这个（默认？）libGDX 顶点着色器：

attribute vec4 a_position;
attribute vec4 a_color;
attribute vec2 a_texCoord0;

uniform mat4 u_projTrans;

varying vec4 v_color;
varying vec2 v_texCoords;

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

Answer 1

正如 Dietrich Epp 所指出的，我需要的是通过顶点缓冲区将额外的纹理 co-ordinates 发送到顶点和像素着色器。我已经设法通过编写自己的 SpriteBatch class 实现来实现这一点，它一次设置两个 textures（不是 TextureRegions）并批量绘制这些带有几个稍微扩展的着色器，如下所示：

顶点着色器

attribute vec4 a_position;
attribute vec4 a_color;
attribute vec2 a_texCoord0;
attribute vec2 a_texCoord1;

uniform mat4 u_projTrans;

varying vec4 v_color;
varying vec2 v_texCoords0;
varying vec2 v_texCoords1;

void main() {
    v_color = a_color;
    v_texCoords0 = a_texCoord0;
    v_texCoords1 = a_texCoord1;
    gl_Position = u_projTrans * a_position;
}

这是默认的顶点着色器，但 attribute vec2 a_texCoord 替换为一组两个 tex co-ords，结果 varying vec2 v_texCoordsX 用于传递给片段着色器。这个额外的 attribute vec2 然后通过顶点缓冲区发送。

片段着色器

#ifdef GL_ES
    precision mediump float;
#endif

varying vec4 v_color;
varying vec2 v_texCoords0;
varying vec2 v_texCoords1;
uniform sampler2D u_texture0;
uniform sampler2D u_texture1;

void main() {
    vec4 texColor = texture2D(u_texture0, v_texCoords0);
    vec4 maskColor = texture2D(u_texture1, v_texCoords1);
    gl_FragColor = vec4(
        vec3(v_color * texColor),
        maskColor.a
    );
}

同样，片段着色器现在接收两个 sampler2D 纹理作为采样，以及一对纹理 co-ordinates 供每个纹理参考。

SpriteBatch class 中变化的关键是扩展构造函数中的 Mesh 定义：

    mesh = new Mesh(Mesh.VertexDataType.VertexArray, false, size * 4, size * 6, new VertexAttribute(VertexAttributes.Usage.Position, 2,
            ShaderProgram.POSITION_ATTRIBUTE), new VertexAttribute(VertexAttributes.Usage.ColorPacked, 4, ShaderProgram.COLOR_ATTRIBUTE),
            new VertexAttribute(VertexAttributes.Usage.TextureCoordinates, 2, ShaderProgram.TEXCOORD_ATTRIBUTE + "0"),
            new VertexAttribute(VertexAttributes.Usage.TextureCoordinates, 2, ShaderProgram.TEXCOORD_ATTRIBUTE + "1"));

上面的最后一行是新添加的，一对 co-ordinates for a_texCoord1。 draw() 方法传递两个 Sprite 或 TextureRegion 实例，并稍微扩展以将每个 point/index 的每组顶点的 2 个额外浮点数传递给顶点数组。最后，对着色器进行了轻微的添加，设置为绑定两个纹理并将制服设置为：

    shader.setUniformi("u_texture0", 0);
    shader.setUniformi("u_texture1", 1);

而且有效！我的临时解决方案是将两个精灵绘制到屏幕上，彼此重叠，将透明度信息写入显示缓冲区，但由于每个纹理的 SpriteBatch 批处理，并且我的图像被分割成多个纹理，这是导致不可接受的性能损失，此解决方案已修复:)

LibGDX 如何使用 Sprites 和 SpriteBatch 在单个位置组合 2 个纹理以进行多纹理处理

LibGDX How to combine 2 textures in single location for multitexturing, using Sprites and SpriteBatch

java

opengl

shader

lwjgl

libgdx