How to properly change resolution

Question

I'm trying to understand how LibGDX handles screen size / resolution, etc. Coming from XNA this seems very confusing to me. Basically I want to support 480x800 for my game. If the screen size is different it should scale the resolution and use letterboxing. To do this I use a FitViewport. And that's the code:

public static final int VIRTUAL_WIDTH = 480;
public static final int VIRTUAL_HEIGHT = 800;
Viewport viewport;
SpriteBatch spriteBatch;
ShapeRenderer shapeBatch;
Texture img;

@Override
public void create()
{
    viewport = new FitViewport(VIRTUAL_WIDTH, VIRTUAL_HEIGHT);
    spriteBatch = new SpriteBatch();
    shapeBatch = new ShapeRenderer();
    img = new Texture("test.jpg");
}

@Override
public void resize(int width, int height)
{
    viewport.update(width, height);
}

@Override
public void render()
{
    Gdx.gl.glClearColor(0, 0, 0, 1);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

    shapeBatch.begin(ShapeType.Filled);
    shapeBatch.setColor(Color.GRAY);
    shapeBatch.rect(0, 0, viewport.getWorldWidth(), viewport.getWorldHeight());
    shapeBatch.end();

    spriteBatch.begin();
    spriteBatch.draw(img, 0, 0);
    spriteBatch.end();
}

Now if I set the game resolution to be 480x800 right at the beginning, it basically works except that if I change the window size, the resolution keeps to be 480x800. So it stretches the image but keeps the aspect ratio:

And if I run the game with any other resolution like for example 700x500 I get this:

What is going on behind the scenes? (And sorry if my english is bad)

Answer 1

You could try using a Camera when drawing your images. Create a new OrthographicCamera like so:

OrthographicCamera cam = new OrthographicCamera(VIRTUAL_WIDTH, VIRTUAL_HEIGHT);

Now when you create your viewport, pass the camera into the constructor.

Viewport viewport = new FitViewport(VIRTUAL_WIDTH, VIRTUAL_HEIGHT, cam);

Now in your render method:

@Override
public void render(){

    Gdx.gl.glClearColor(0, 0, 0, 1);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

    spriteBatch.setProjectionMatrix(cam.combined); //Important

    shapeBatch.begin(ShapeType.Filled);
    shapeBatch.setColor(Color.GRAY);
    shapeBatch.rect(0, 0, viewport.getWorldWidth(), viewport.getWorldHeight());
    shapeBatch.end();

    spriteBatch.begin();
    spriteBatch.draw(img, 0, 0);
    spriteBatch.end();

}

Now to resize the viewport:

@Override
public void resize(int width, int height)
{
    viewport.update(width, height);
}

or if you would like to keep the camera center:

@Override
public void resize(int width, int height)
{
    viewport.update(width, height, true);
}