libgdx - 着色器绘制出乎意料的透明背景
问题描述
我有一个新的类MyActor
扩展 Actor,其中应用了着色器。
但是,着色器会意外填满透明背景。
draw()
里面的方法代码MyActor
如下:
@Override
public void draw(Batch batch, float parentAlpha) {
if(shaderProgram!=null)
{
batch.setShader(shaderProgram);
}
if(!drawParentAtBack)super.draw(batch, parentAlpha); // by default is false
Color c = getColor(); // used to apply tint color effect
batch.setColor(c.r, c.g, c.b, c.a * parentAlpha);
if ( isVisible() )
{
if(displayFrame !=null) // a textureregion
{
batch.draw(displayFrame,
getX(),getY(),
getOriginX(),getOriginY(),
getWidth(),getHeight(),
getScaleX(),getScaleY(),
getRotation());
}
}
if(drawParentAtBack)super.draw(batch, parentAlpha);
if(shaderProgram!=null)
{
batch.setShader(null);
}
}
public void setShader(String vs, String fs){
vertexShaderCode = Gdx.files.internal("shaders/" + vs + ".vs").readString();
fragmentShaderCode = Gdx.files.internal("shaders/" + fs + ".fs").readString();
shaderProgram = new ShaderProgram(vertexShaderCode, fragmentShaderCode);
if (!shaderProgram.isCompiled())
{
d( "Shader compile error: " + shaderProgram.getLog() );
}
}
我的定义是这样的:
MyActor myActor1;myActor2;
..... // setting up myActor1 & myActor2
myActor1.setShader("default","greyScale");
myActor2.setShader("default","greyScale");
本教程中我的简单着色器代码:
#ifdef GL_ES
precision mediump float;
#endif
varying vec4 v_color;
varying vec2 v_texCoords;
uniform sampler2D u_texture;
uniform mat4 u_projTrans;
void main() {
vec3 color = texture2D(u_texture, v_texCoords).rgb;
float gray = (color.r + color.g + color.b) / 3.0;
vec3 grayscale = vec3(gray);
gl_FragColor = vec4(grayscale, 1.0);
}
本教程中我的顶点着色器代码:
#ifdef GL_ES
precision mediump float;
#endif
varying vec4 v_color;
varying vec2 v_texCoords;
uniform sampler2D u_texture;
uniform mat4 u_projTrans;
void main() {
vec3 color = texture2D(u_texture, v_texCoords).rgb;
float gray = (color.r + color.g + color.b) / 3.0;
vec3 grayscale = vec3(gray);
gl_FragColor = vec4(grayscale, 1.0);
}
我的预期结果图像是具有透明背景的灰色形状,但结果是这样的:
没有着色器的示例形状图像:
请有任何帮助。
解决方案
一般来说,透明度是通过Alpha Blending实现的。片段的 alpha 通道控制透明度,必须设置。
在片段着色器中,纹理的 Alpha 通道被省略:
gl_FragColor = vec4(grayscale, 1.0);
将纹理 ( u_texture
) 的 alpha 通道设置为输出 ( gl_FragColor.a
) 的 alpha 通道:
#ifdef GL_ES
precision mediump float;
#endif
varying vec4 v_color;
varying vec2 v_texCoords;
uniform sampler2D u_texture;
uniform mat4 u_projTrans;
void main() {
// read RGB color channels and alpha channel
vec4 color = texture2D(u_texture, v_texCoords);
float gray = (color.r + color.g + color.b) / 3.0;
vec3 grayscale = vec3(gray);
// write gray scale and alpha channel
gl_FragColor = vec4(grayscale.rgb, color.a);
}
推荐阅读
- java - Java Micrometer @Counted - @ExceptionHandler 的 exception="none" 和 result="success"?
- tensorflow - 如何使用 gpu 并行训练 tensorflow.keras 模型?TensorFlow 版本 2.5.0
- java - Java:Canvas.drawline,如何画粗线
- database - 此数据库的类型
- python - fastapi + sqlalchemy + pydantic → 如何处理多对多关系
- c - 如何在 jenkins 中将 JDepend 用于 c 代码?
- javascript - 如何在 django 中将数据顶部传递给 javascript
- javascript - Vuetify 日期选择器
- excel - Excel 更新计算
- jquery - 创建适用于两个单独脚本的随机 ID