# Making a pixel-perfect viewport in LibGDX

My game that uses LibGDX as the graphics library, should be playable with every display. Here's the problem: It have to be pixel-perfect. That means, the scale factor must be an integer value, so that my pixels do not stretch over two physical pixels - resulting in flickering pixels which I obviously do not want.

The player should see a constant amount Y of vertical space. The width is calculated by the screen resolution. My game field is designed for 4:3. Therefore a player with 16:9 or even 21:9 should see more in the horizontal space. Best example: An usual Pong field. The field is 4:3. A player with 16:9 should see the same field size, but with more "empty" space on the sides.

I've tried various approaches to achieve this. The first was the ScreenViewport, provided by LibGDX. Problem: Adjusting the unitsPerPixel would result in a smaller playfield. Or even mirroring it. I could provide a high-res playfield and scale it down with unitsPerPixels, but it is not very future-proof (Think of providing a 4k field for a future 512k monitor).

My second approach was a custom viewport. (No worries! It is written in Kotlin)

worldWidth *= (screenHeight/worldHeight).toInt()
worldHeight *= (screenHeight/worldHeight).toInt()

setScreenBounds(
screenWidth/2 - worldWidth.toInt()/2,
screenHeight/2 - worldHeight.toInt()/2,
worldWidth.toInt(),
worldHeight.toInt() )


It tries to scale up the field by a integer number (making it pixel-perfect). Problem: The unscaled zones (that would be normally covered by the non-integer-scaling) are black. Black bars. Instead, I want to show the game world.

Any ideas how to achieve this? Thanks!