android - Centering GLViewport position within physical screen

I'm developing my app on one device and want it to display at the same ratio on all other devices.

Currently what I have is 'image 1' in my image below - the game fits perfectly onto my development device's screen.

If I keep the viewport at the same ratio then I get the results seen in 'image 2'.

This is great, but now I need to center the viewport , and I'm not sure how to do that.

What I'm aiming for is what is in 'image 3' - just not sure how to get there.

This is how I'm keeping the viewport at the same ratio:

the ratio is width / height (this is 1.702127659574468 and we will use this explicitly)

//Set viewport size based on screen dimensions      

GLES20.glViewport(XVal, YVal, (int) (height * 1.702127659574468), height);

At the moment, XVal and YVal are both 0 - I need to change XVal to move the image along.

How do I work out the amount to move the viewport along by? (I know it will be equal to half of the space to the right of the viewport ('image 2') - just not sure how to work this out.......)

Answer

xoffset = (targetScreenWidth - image1Width)/2;