Graphics GLSL着色器圆在LibGDX中更改大小时抖动
在LibGDX中,我创建了一个着色器来实现过渡效果,其中一个圆在图像顶部形成,圆外的所有东西都是黑色,而圆内的所有东西都显示为正常。这个圆一开始很大,然后缩小到零。但我有一个问题,因为圆圈在缩小,它在摆动。我还发现,在使用着色器之前,当使用着色器渲染器创建一个也随时间收缩的圆时,我遇到了这个问题。我认为这个问题与浮点数或圆的渲染方式有关。不管怎样,我需要知道,我如何修复它,这样我才能使圆平滑地收缩 下面是一个gif演示我的摆动圆问题(我需要平滑): 以下是我的片段着色器代码:Graphics GLSL着色器圆在LibGDX中更改大小时抖动,graphics,libgdx,glsl,shader,Graphics,Libgdx,Glsl,Shader,在LibGDX中,我创建了一个着色器来实现过渡效果,其中一个圆在图像顶部形成,圆外的所有东西都是黑色,而圆内的所有东西都显示为正常。这个圆一开始很大,然后缩小到零。但我有一个问题,因为圆圈在缩小,它在摆动。我还发现,在使用着色器之前,当使用着色器渲染器创建一个也随时间收缩的圆时,我遇到了这个问题。我认为这个问题与浮点数或圆的渲染方式有关。不管怎样,我需要知道,我如何修复它,这样我才能使圆平滑地收缩 下面是一个gif演示我的摆动圆问题(我需要平滑): 以下是我的片段着色器代码: varying v
varying vec4 v_color;
varying vec3 v_position;
varying vec2 v_texCoord0;
uniform vec2 u_resolution;
uniform sampler2D u_sampler2D;
uniform float u_radius;
uniform int u_hasCircle;
void main() {
vec4 color = texture2D(u_sampler2D, v_texCoord0) * v_color;
vec2 relativePosition = gl_FragCoord.xy / u_resolution - .5;
relativePosition.x *= u_resolution.x / u_resolution.y;
float len = length(relativePosition);
if (u_hasCircle == 1 && len > u_radius) {
color = vec4(0, 0, 0, 1);
}
gl_FragColor = color;
}
这是我之前运行的顶点着色器代码:
属性向量4 a_颜色;
属性向量3 a_位置;
属性vec2 a_texCoord0
统一的mat4 u_项目;
均匀vec3u_畸变
varying vec4 v_color;
varying vec3 v_position;
varying vec2 v_texCoord0;
void main() {
v_color = a_color;
v_position = a_position;
v_texCoord0 = a_texCoord0;
gl_Position = u_projTrans * vec4(a_position, 1.0);
}
当我想转换为运行时,u_hasCircle传递1,否则传递0。当转换运行时,我从传递u_半径1开始,然后在LibGDX中使用a将值逐渐减小到0。
我每帧向着色器发送一次这些值
以下是与着色器交互的相关Libgdx Java代码:
public class PlayWorld extends Group implements InputProcessor, Disposable
{
//various members
private PlayScreen screen;
private OrthographicCamera camera;
private FloatAction transitionToBattleAction;
private final float TRANS_TO_BATTLE_DURATION = 10f;
private float circleSize;
private boolean hasCircle = false;
public PlayWorld(PlayWorld playWorld) {
this.playWorld = playWorld;
camera = new OrthographicCamera();
tiledMap = new TiledMapActor(camera);
addActor(tiledMap);
transitionToBattleAction = new FloatAction();
}
//function that triggers transition
public void enterBattle() {
transitionToBattleAction.reset();
transitionToBattleAction.setStart(0);
transitionToBattleAction.setEnd(1);
transitionToBattleAction.setDuration(TRANS_TO_BATTLE_DURATION);
addAction();
}
// this function gets called every frame
@Override
public void act(float delta) {
super.act(delta);
if (transitionToBattleAction.getValue() == 0) {
//this function is defined in code shown below
tiledMap.unsetCircleSize();
} else if (transitionToBattleAction.getValue() < 1) {
//this function is defined in code shown below
tiledMap.setCircleSize(
1 - transitionToBattleAction.getValue());
} else if (transitionToBattleAction.getValue() == 1) {
//this function is defined in code shown below
tiledMap.setCircleSize(
1 - transitionToBattleAction.getValue());
transitionToBattleAction.restart();
screen.getGame().setScreen("battle");
} else if (transitionToBattleAction.getValue() > 1) {
//this function is defined in code shown below
tiledMap.unsetCircleSize();
transitionToBattleAction.restart();
}
}
//this gets called whenever the window resizes
public void resize(int width, int height) {
// this function is defined in code shown below
tiledMap.resize(width, height);
}
//various other methods
}
所以我发现了问题,愚蠢的我!每一帧开始时,我都会重新进入过渡场景。我通过使用一个布尔标志来告诉我转换是否已经开始,并且只有在没有设置该布尔标志的情况下才开始转换,从而修复了这个问题。然后,在某一点上,在转换完成后,我将该布尔标志设置回false,以便再次发生转换
public class TiledMapActor extends Actor implements InputProcessor, Disposable
{
//various variables
private ShaderProgram shader;
private OrthographicCamera camera;
private TiledMap map;
private OrthogonalTiledMapRenderer renderer;
private float UNIT_SCALE = 1 / 16f;
public TiledMapActor(OrthographicCamera camera) {
super();
this.camera = camera;
map = new TmxMapLoader().load("myMap.tmx");
renderer = new OrthogonalTiledMapRenderer(map, UNIT_SCALE);
shader = new ShaderProgram(
Gdx.files.internal("shaders/myshader.vsh"),
Gdx.files.internal("shaders/myshader.fsh");
System.out.println(
shader.isCompiled() ?
"shader compiled" : shader.getLog());
renderer.getBatch().setShader(shader);
shader.begin();
shader.setUniformi("u_hasCircle", 0);
shader.end();
}
// this is called every time the window changes size
// from the PlayScreen class, see code above
public void resize(int width, int height) {
camera.viewportWidth = width;
camera.viewportHeight = height;
camera.update();
shader.begin();
shader.setUniformf("u_resolution", (float)width, (float)height);
shader.end();
}
//this method is called from code above, seen PlayScreen class code
//
public void setCircleSize(float circleSize) {
this.circleSize = circleSize;
hasCircle = true;
shader.begin();
shader.setUniformf("u_radius", circleSize);
shader.setUniformi("u_hasCircle", 1);
shader.end();
}
//this method is called from code above, seen PlayScreen class code
//
public void unsetCircleSize() {
hasCircle = false;
shader.begin();
shader.setUniformi("u_hasCircle", 0);
shader.end();
}
// Various other methods
}