Graphics GLSL着色器圆在LibGDX中更改大小时抖动

Graphics GLSL着色器圆在LibGDX中更改大小时抖动,graphics,libgdx,glsl,shader,Graphics,Libgdx,Glsl,Shader,在LibGDX中,我创建了一个着色器来实现过渡效果,其中一个圆在图像顶部形成,圆外的所有东西都是黑色,而圆内的所有东西都显示为正常。这个圆一开始很大,然后缩小到零。但我有一个问题,因为圆圈在缩小,它在摆动。我还发现,在使用着色器之前,当使用着色器渲染器创建一个也随时间收缩的圆时,我遇到了这个问题。我认为这个问题与浮点数或圆的渲染方式有关。不管怎样,我需要知道,我如何修复它,这样我才能使圆平滑地收缩 下面是一个gif演示我的摆动圆问题(我需要平滑): 以下是我的片段着色器代码: varying v

在LibGDX中,我创建了一个着色器来实现过渡效果,其中一个圆在图像顶部形成,圆外的所有东西都是黑色,而圆内的所有东西都显示为正常。这个圆一开始很大,然后缩小到零。但我有一个问题,因为圆圈在缩小,它在摆动。我还发现,在使用着色器之前,当使用着色器渲染器创建一个也随时间收缩的圆时,我遇到了这个问题。我认为这个问题与浮点数或圆的渲染方式有关。不管怎样,我需要知道,我如何修复它,这样我才能使圆平滑地收缩

下面是一个gif演示我的摆动圆问题(我需要平滑):

以下是我的片段着色器代码:

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
}