LibGDX Orthographic Camera: Center the image so borders are symmetrical (java)

Question

I am making a game in LibGDX. I'm using the orthographic camera class to scale the image and it works great. My only issue is with the black border. Since opengl draws the image at 0,0 which is the bottom left corner, the black border when the screen is scaled improperly is either on the top or the right. Ex:

Border on right:

enter image description here

Border on top:

enter image description here

What I want to do is make them like this:

Border used to be on right, now it's on right and left, perfectly symmetrical:

enter image description here

Same for this one. It used to just be on top but now it's evenly on top and bottom:

enter image description here

Anyone know how to do this? I think it would look muuuch nicer and more professional. Thanks in advance.

EDIT: This is what I tried so far:

Here is what I did so far:

double ratio = 1280 / 720;
double newRatio = width / height;
System.out.println("" + newRatio + "    " + ratio);
System.out.println("" + width + "   " + height);
if(newRatio < ratio){
    System.out.println("herro");
    double x = width / ratio;
    double dif = height - x;
    cam.setPosition(0f, (float)(dif / 2));
}

Not sure how this works with LibGDX. This would be the same problem using OpenGL directly: stackoverflow.com/questions/24308894/…. The math and logic might still help. — Reto Koradi
I put what I did so far in the question. There is a really weird bug where my ratio is 1.0, that doesn't make any sense. Other than that I think that this math should work, at least for the height. — vedi0boy
I figured out why it does that. I'm still trying to get the math logic down. I'm actually not using the orthographic camera given by libgdx. Im using a different class I got on the internet that the author said I can use. I can put a link to the github here if you want. — vedi0boy

Mehdi Mehdi · Accepted Answer · 2014-09-19T23:04:39

you will have to center the image at first it would look something like:

image_x = screen_width/2 - image_width/2;
image_y = screen_height/2 - image_height/2;

then in the resize methode provided by LibGDX you will have to change the viewport, it would look like:

 public void resize(int newWidth, int newHeight) {
    Gdx.GL30.glViewport(0, 0, newWidth, newHeight);
 }

the version of the GL depends on your config.

LibGDX Orthographic Camera: Center the image so borders are symmetrical (java)

1 Answers