Search code examples
androidlibgdxtexturesgimp

LibGDX anti-aliasing makes gray edges

I've small (20x20) circles in my libGDX stage. I have created the texture with GIMP, and for hdpi devices it is (30x30). When I use it in my game, it looks like this, as expected. enter image description here

But when I tried linear filtering with following code 

textureRegion.getTexture().setFilter(Texture.TextureFilter.Linear,Texture.TextureFilter.Linear);

,The circle has for some reason gray edges:

Circle with linear filtering

I checked the image in GIMP and it does not have any anti-aliased pixels. The original texture looks same as the first image. Why does it occur and how could I have a smooth circle?

Solution

  • If minification is used then border might have to be little bigger. And to avoid gray borders syndrome, transparent border should not be color(0,0,0,0) but color of the edge with alpha channel of 0. So white edge picture would use 255,255,255,0 as border color.

    enter image description here

    EDIT

    How I add border with transparent layer using GIMP :

    1. Create Canvas with any size(Image Size in GIMP) that you want (File -> New)

    2. Draw your Image with transparent outer border/space on a layer.

    3. Create new Layer below your Image Layer without space/border with Colour(255,255,255,0) so that this layer become invisible.

    4. Export your Image.

    enter image description here