Search Unity

Question UI RawImage with a texture shows texure's content in low quality/off colors/jagged edges

Discussion in 'UGUI & TextMesh Pro' started by HuldaGnodima, Jan 23, 2022.

  1. HuldaGnodima

    HuldaGnodima

    Joined:
    Oct 10, 2016
    Posts:
    110
    Hello all!

    This is a super tricky problem for me, I'm not well-versed in UI-textures but need it to fade in my character in dialogue.

    My set up is like so:
    1
    . I have a 2D-character animated in Unity's 2DAnimation tool:

    upload_2022-1-23_15-53-7.png
    (Image 1: Note how smooth her colors and edges are in the "Scene" window. That is how I have painted her).

    This character model is animated in Unity's 2DAnimation in the scene (with bones).

    2. The reason I have to animate her in the scene (and not in the UI) is because Unity's bone 2Danimation system cannot be UI-elements, but I want to render her and controll her opacity in the UI (when dialogue is spoken). So to remedy this I have added a RawImage to my UI, seen here:
    upload_2022-1-23_15-58-24.png
    (Image 2: Note how the Raw Image has a Texture attached to it).

    This rendertexture looks like this:
    upload_2022-1-23_16-0-45.png
    (Image 3: the texture and its settings that is linked to the UI raw image)

    3.
    So I'm using the UI raw-image (that shows a render texture) that only renders what is in its layer (which happens to be my character's portrait).

    Now to the thing that does not work. If you look in game, the character rendered by the camera via the render-texture doesn't look exactly like I painted her (her edges aren't smooth, the colors are off and also 'break' and look lower quality). See example in image below:
    upload_2022-1-23_16-5-31.png
    (Image 4: The low resolution colors and the jagged edges that the camera shows in game)
    Here's a zoomed in image so it's more visible:
    upload_2022-1-23_16-7-26.png
    (Image 5. A zoomed up image how how the game renders the character in game. Colors are off, edges are rougher, the black pants have a wierd color-effect)

    I don't know why she looks different in game than how I have painted her, and why the qality of her colors and edges are off.

    What I'm trying to do/what I would like:
    I would like her to look like as I have painted her (no jagged edges, smooth colors, color-correct). She looks like that in the scene, but not when rendered in game.

    What I've tried so far:
    I've tried using different settings on the render texture (the size is currently 2048 x 2048, see Image 3 above, and raising this number doesn't seem to affect her edges). I've tried different color-formats, and that seems to greatly alter her render-quality and colors, but I can't find one that works well (no color-artefacts, rough edges). The one I'm using now is B5G5R5A1_UNORM_PACK16 (you can see that in Image 3 too). It's the best one I've found but it is that one that produces the results above. Here is a video of me swapping to other "Color Formats":

    (Note: you can see how changing the "Color Format" affects so many aspects of how she is rendered; the way her colors look, her background, if she looks more/less jagged etc. For this reason I thought I might be using the wrong Color Format.).


    Does anyone know what I'm doing wrong and how I can fix this? Is there a setting somewhere, should I maybe put the texture to a color format I haven't tried? Is it something else entirely? I'm so grateful for any help at all, I feel like I'm at a bit loss of what I could even try now.

    Thanks so much in advance!
     
  2. HuldaGnodima

    HuldaGnodima

    Joined:
    Oct 10, 2016
    Posts:
    110
    Does anyone know? Any tips are massively appreciated.