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在已正确设置着色器以绘制它，但这些坐标对于第二个texture / sampler2D均匀属性是错误的。这是我第一次尝试使用着色器，所以我确定我错过了一些基本的东西！

---更新---

到目前为止，我的谷歌搜索显示我可能需要通过顶点着色器设置更多内容。我使用这个（默认？）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指出的那样，我需要的是通过顶点缓冲区将额外的纹理坐标发送到顶点和像素着色器。我设法通过编写我自己的SpriteBatch类实现来实现这一目标，该类一次设置两个texture（而不是TextureRegion s）并使用一些稍微扩展的着色器，如下所示：

顶点着色器

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纹理来进行采样，以及一对纹理坐标来指代每个纹理。

SpriteBatch类中更改的关键是扩展构造函数中的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"));

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

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

它有效！我的临时解决方案是将两个精灵画在彼此顶部的屏幕上，将透明度信息写入显示缓冲区，但由于SpriteBatch为每个纹理进行批处理，并且我的图像被分割为多个纹理，这是导致不可接受的性能损失，该解决方案已修复：）

LibGDX如何使用Sprites和SpriteBatch

1 个答案: