Search Unity

  1. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

Question UI 9 slice texture aliasing issue

Discussion in 'UGUI & TextMesh Pro' started by ahoffmann, Aug 18, 2023.

  1. ahoffmann

    ahoffmann

    Joined:
    Dec 10, 2018
    Posts:
    10
    input field aliasing.png
    I'm working on VR project with a world space canvas for UI. It is using the above dropdown / input fields, but they have an obnoxious aliasing problem along the light colored border that I can't figure out.

    The field image is using a square 512x512 9-sliced texture. The texture consists of a large outer alpha padding area, a drop shadow, the bright rounded rectangle border, and the inner blue fill. The texture is using mip maps.

    I've tried playing with texture resolution, mip map bias, and texture filtering settings, but none of them help the aliasing. I've found that if I make the texture a similar aspect ratio to the field (e.g. 256x1024) instead of square it will fix the aliasing. But this somewhat defeats the point of using 9-sliced images.

    Does anyone know what the source of this border aliasing artifact might be, and what techniques exist to deal with it?
     
  2. Kurt-Dekker

    Kurt-Dekker

    Joined:
    Mar 16, 2013
    Posts:
    38,256
    I will speculate this may be from how the original image was authored and saved.

    It looks like the partial-alpha edges of the line might be simultaneously fading to black.

    Try a quick remake but author the items by using the alpha of the first and "copying" that shape from a pure white image, pasting it back into that image, then deleting the solid white underlayer (like in gimp / photoshop).
     
  3. ahoffmann

    ahoffmann

    Joined:
    Dec 10, 2018
    Posts:
    10
    I don't understand what you mean by "copying that shape from a pure white image". But I still see the aliasing even if the texture background is black instead of transparent. aliasing 2.jpg

    If I make the texture 256x1024 instead of square it looks like this
    no aliasing.jpg