Using Libgdx and TexturePacker with xxxdpi Images Are Distorted

Question

I am an Android developer, having created my first game using LibGDX. After reading A LOT, there is still one thing that I do not understand.

I understand that I must have one set of images, for the highest resolution of 2560x1440 (to prevent the ugly scaling of non-vector images).

I use TexturePacker to pack my images and even use linear linear to get maximum quality:

TexturePacker.Settings settings = new TexturePacker.Settings(); settings.filterMin = Texture.TextureFilter.Linear; settings.filterMag = Texture.TextureFilter.Linear; settings.maxWidth = 4096; settings.maxHeight = 2048; TexturePacker.process(settings, inputDir, outputDir, packFileName); 

I installed my camera, as recommended in several SOs, on fixed counters and avoided all the PPM stuff. From the C'TOR screen:

 mCamera = new OrthographicCamera(); mCamera.viewportWidth = 25.6f; ; // 2560 / 100 mCamera.viewportHeight = 14.4f ; // 1440 / 100 mCamera.position.set(mCamera.viewportWidth / 2, mCamera.viewportHeight / 2, 0f); mCamera.update(); 

As you can see, I decided to work with 1 meter = 100 pixels.

Now this means that I have to draw my 1/100 sprites, which I do here:

 TextureAtlas atlas = new TextureAtlas(Gdx.files.internal("images/pack.atlas")); mImage = atlas.createSprite("image")); mImage.setSize(mImage.getWidth() / 100 , mImage.getHeight() / 100); 

This works and the images are displayed as intended. BUT, they are distorted like hell! an absolutely round image looks uneven at the edges, not round.

So my questions are:

• Is this the best practice or do I need to work differently?
• Am I correct only the highest quality images?
• Is the distortion meaning that my code really reduces the sprite and somehow libgdx expanded it again and damaged the quality?

Thanks!

EDIT
I am going to adapt @ Tenfour04 answers to (1) and (2).
As for (3), the problem is related to Genymotion :(, its pixelization of the game. I tested it on real devices with several resolutions and looked perfect.

Answer 1

• You have one mistake when setting up the camera: you assume that the screen always has the same aspect ratio, but in fact it will be different. It’s better to choose a constant height or width (choose depending on the type of game you are doing) and adjust the opposite dimension based on the aspect ratio of the current screen. For instance:

  mCamera.viewportHeight = 25.6f; //game screen always 25.6 meters tall

  mCamera.viewportWidth = 25.6f / (float)Gdx.graphics.getHeight() * (float)Gdx.graphics.getWidth();

• "I have to have one set of images for the highest resolution." This is not necessarily the case. If you do, you will have to download very high resolution images on devices that cannot use them. This will use a lot of memory and increase boot time. This might be nice during development, but along the way, you probably want to have two or three lower resolution versions that you can selectively download.

  For this reason, I also avoid hard coding that 100 everywhere in your code. Make pixelsPerMeter variable that is set once at game start. At the moment, this may be only 100, but if you decide to make some lower resolution later, you can adjust it accordingly without finding all occurrences of 100 in your code.

• Your minimum filter should be MipMapLinearLinear or MipMapLinearNearest . Otherwise, performance will suffer when sprites are smaller than their own resolution, and may look distorted, as you described. You can look at the mip mapping to see why this is so.