Ambiguous results with Frame Buffers in libgdx

Question

I am getting the following weird results with the FrameBuffer class in libgdx.

Here is the code that is producing this result:

// This is the rendering code
@Override
public void render(float delta) {
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT | GL20.GL_DEPTH_BUFFER_BIT);

    stage.act();
    stage.draw();

    fbo.begin();
    batch.begin();
    batch.draw(heart, 0, 0);
    batch.end();
    fbo.end();  

    test = new Image(fbo.getColorBufferTexture());
    test.setPosition(256, 256);
    stage.addActor(test);
}

//This is the initialization code
@Override
public void show() {
    stage = new Stage(Gdx.graphics.getWidth(), Gdx.graphics.getHeight(), false);
    atlas = Assets.getAtlas();
    batch = new SpriteBatch();

    background = new Image(atlas.findRegion("background"));     
    background.setFillParent(true); 
    heart = atlas.findRegion("fluttering");
    fbo = new FrameBuffer(Pixmap.Format.RGBA8888, heart.getRegionWidth(), heart.getRegionHeight(), false);

    stage.addActor(background);
    Image temp = new Image(new TextureRegion(heart));
    stage.addActor(temp);
}

Why is it that I am getting the heart that I drew on the frame buffer to get flipped and be smaller than the original one though the frame buffer width and height are the same as that of the image (71 x 72).

Answer 1

Your SpriteBatch is using the wrong projection matrix. Since you are rendering to a custom sized FrameBuffer you will have to manually set one.

projectionMatrix = new Matrix4();
projectionMatrix.setToOrtho2D(0, 0, heart.getRegionWidth(), heart.getRegionHeight());
batch.setProjectionMatrix(projectionMatrix);

Answer 2

To solve this, the frame buffer has to have a width and height equal to that of stage, like this:

fbo = new FrameBuffer(Pixmap.Format.RGBA8888, Gdx.graphics.getWidth(), Gdx.graphics.getHeight(), false);