Search Unity

  1. Calling all beginners! Join the FPS Beginners Mods Challenge until December 13.
    Dismiss Notice
  2. It's Cyber Week at the Asset Store!
    Dismiss Notice

Using Render Textures on a uGUI Image, Panel or Button?

Discussion in 'Unity UI (uGUI) & TextMesh Pro' started by infinitypbr, Oct 5, 2014.

  1. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Hello!

    I'm trying to put my minimap into the uGUI system. Is it possible to get a Render Texture working with these? I've got my render texture attached to a material, and can put the material onto a uGUI Button object, but it doesn't show anything (is 100% transparent). The camera is working, however.

    Thanks!
     
  2. JAKJ

    JAKJ

    Joined:
    Aug 17, 2014
    Posts:
    185
    RawImage component.
     
  3. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Awesome. I've tried it on an image, but the results are not what I expected, as shown in the image.

    You can see the camera preview, which is what I'd like this to look like. However, in the scene view it looks semi-transparent. In the game view is barely noticeable at all. The image has full 255,255,255,255 color though.

    Any ideas where I'm going wrong?
     

    Attached Files:

  4. JAKJ

    JAKJ

    Joined:
    Aug 17, 2014
    Posts:
    185
    You probably also need a material. From what I understand, you're supposed to pair textures and materials: Textures provide the pixels, and materials apply them to the surface.
     
  5. StarManta

    StarManta

    Joined:
    Oct 23, 2006
    Posts:
    6,877
    I don't believe that's the case with the RawImage component; I'm pretty sure it has a default material that gets applied to it.

    If you put an Image component on that object instead, is it visible? I suspect there is an alignment/anchoring/layering issue going on here, rather than a RawImage issue.
     
  6. JAKJ

    JAKJ

    Joined:
    Aug 17, 2014
    Posts:
    185
    I'm making a tile-based game and using rawimages in a grid to make the floor. I got a set of textures off the asset store and each texture includes a texture object and a material object. When I was trying to get it to work, I tried applying just one or the other, but it screwed up every time (including appearing semi-transparent), but when I put both the texture and material, it worked.

    So it pretty much is the case with the rawimage component.
     
  7. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Unfortunately I haven't had the same experience. When adding a material, the scene view shows a pinkish and blocky version of the cameras view, and nothing shows in the game view. Removing the material returns it to the state shown above.
     

    Attached Files:

  8. Tim-C

    Tim-C

    Unity Technologies

    Joined:
    Feb 6, 2010
    Posts:
    2,093
    Check the alpha channel of the color on the RawImage component.
     
  9. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Hi Tim,

    When the game is running, I can see changes made to the color of the material in the scene view. But while the material is attached, there's nothing showing in the game view. Changing the alpha, which is already to full value, doesn't do anything to the scene view.

    When I remove the material I can see the texture in the game view, but it's very transparent even though the alpha is full.

    I think I'll just use the normal camera display with adjusting the viewport rect to get it to show in the top corner -- is that worse for performance than using a render texture?
     
  10. Whippets

    Whippets

    Joined:
    Feb 28, 2013
    Posts:
    1,775
    Bingo! Someone else having this same problem with RenderTextures and RawImage. I look at the RT in the inspector at runtime, and it's perfect; but the RawImage shows mostly transparent.

    Here's an image that shows all the relevant information in the inspectors, and at the top, the Game window, showing that I'm not getting the render texture. Sorry about the lack of UMA clothing, I've not got that far yet XD


    Image29.jpg
     
    Last edited: Oct 8, 2014
  11. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    My latest test has somethings showing properly, but other things -- usually in a color range -- are 100% transparent. Notice the club, for instance.
     

    Attached Files:

  12. StarManta

    StarManta

    Joined:
    Oct 23, 2006
    Posts:
    6,877
    Looks like it is now using the lightness of the image as the alpha?
     
  13. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    And one more -- same thing, but the camera is now only rendering the player and weapon models. It's on a UI.Image background, and you can slightly see the club, but just barely.
     

    Attached Files:

  14. Whippets

    Whippets

    Joined:
    Feb 28, 2013
    Posts:
    1,775
    There's definitely something not right about RTs and uGUI - I can't see any wrong settings, and like you, get a transparency problem.
     
    infinitypbr likes this.
  15. HonorableDaniel

    HonorableDaniel

    Joined:
    Feb 28, 2007
    Posts:
    2,854
    Apply a material in the Diffuse shader. Fixes all transparency issues with RT's.
     
  16. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Actually that doesn't work at all -- adding a diffuse material with the texture assigned makes the texture go 100% transparent. At least for me.
     

    Attached Files:

    Whippets likes this.
  17. Tim-C

    Tim-C

    Unity Technologies

    Joined:
    Feb 6, 2010
    Posts:
    2,093
    Would love a bug on this.
     
    infinitypbr likes this.
  18. Whippets

    Whippets

    Joined:
    Feb 28, 2013
    Posts:
    1,775
    Exactly the same.
     
  19. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    What's the proper way to submit a bug from a giant project (30+gb)? Although it does seem easy to reproduce, as both times I've tried to use Render Textures with the Raw Image component the same thing happens.
     
  20. HonorableDaniel

    HonorableDaniel

    Joined:
    Feb 28, 2007
    Posts:
    2,854
    Whoops, my bad. That is Unlit/Texture the shader you want. Not Diffuse...
     
    infinitypbr likes this.
  21. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Closer! I've got my camera set to clear "Depth Only", and the preview shows just the player & weapon, as expected. But now there's white (mostly) around the window area showing the camera, and some other artifacts it looks like.

    Any idea how to get rid of those?

    Thanks!
     

    Attached Files:

  22. HonorableDaniel

    HonorableDaniel

    Joined:
    Feb 28, 2007
    Posts:
    2,854
    There's your problem, set it to Solid Color.
     
  23. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Well, if I do solid color, then I get a solid color. I'd like the player image to appear on the textured background on my menu screen.
     
  24. HonorableDaniel

    HonorableDaniel

    Joined:
    Feb 28, 2007
    Posts:
    2,854
    I see what you're saying. Here, this might work. Set the camera to clear Depth Only, this should get rid of the white glitching. Next, if the player is still invisible then make sure the player's textures alpha is fully opaque.
     
  25. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    The camera is already at Depth Only -- last time I tested it was a black glitching. Now It's as shown the the image -- the outside areas of the border texture show some glitching, and some very transparent glitching in the borders. And the players club is missing (or mostly transparent), similar to the original problem.

    The shader on the material is set to Unlit/Texture, shader on the player object / weapon is diffuse (full alpha).

    :/
     

    Attached Files:

  26. HonorableDaniel

    HonorableDaniel

    Joined:
    Feb 28, 2007
    Posts:
    2,854
    Yes, but it's irrelevant that the player's weapon is in a diffuse shader. It's the alpha channel of the image that counts.
     
  27. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    All the alphas are at full value for everything. Each time I load the panel (which turns the camera on as well), the background is different -- sometimes black, sometimes transparent but not correct, and sometimes just a mashup of game objects. Very odd.
     
  28. Tim-C

    Tim-C

    Unity Technologies

    Joined:
    Feb 6, 2010
    Posts:
    2,093
    Hrmm, What material are you using on your character when you render it? I just had a look and it seems like on the 'Default' material we have alpha set to 0.5 which leads to some transparency. If you create your own default material but set the alpha on that to 1 it might fix the issue.
     
    twobob likes this.
  29. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    The weapon is part of an asset store package, so it's got a material (diffuse, 255 alpha) with a texture atlas. The character, also from the asset store, also uses diffuse, 255 alpha textures.

    The biggest problem seems to be that the background still gets rendered in some capacity.
     
  30. byrne

    byrne

    Joined:
    Sep 23, 2014
    Posts:
    7
    I also am struggling with uGUI rawimage rendertextures. overlaying rendertexture rawimages on my GUI while retaining camera background transparency is driving me nuts.

    Anyhow, I had a similar issue with random artifacts/materials popping up even tho i save and load the scene exactly the same way. I figured out it was the plugin shaderforge that was screwing with it. I removed the plugin and it fixed it. Could it be an external plugin that is affecting your testing?
     
  31. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Not sure. I don't use shader forge, and all the materials are mobile/diffuse, so I'd guess not. I'm still on b19, so I'm hoping when I jump to a more current one the issue is fixed!
     
  32. darkForester

    darkForester

    Joined:
    Sep 19, 2013
    Posts:
    80
    We are experiencing the same issue here.

    1. Render Texture is fine, although the raw image has weird transparent sections.
    2. Applying a material to the RawImage solves the transparent issue.
    3. Depth Only on the RenderTexture appears to create "Don't Clear" style artifacts on the RawImage

    Hopefully there is a good work around.
     
    infinitypbr likes this.
  33. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Darn, I was hoping this would have been fixed by now. I'm still on b19, but if the problem goes away next time I switch builds, I'd be very happy.
     
  34. darkForester

    darkForester

    Joined:
    Sep 19, 2013
    Posts:
    80
    One solution we found is setting the camera to use a transparent black solid color clearing instead of depth only. This will create a slight outline on the object, but works for now.
     
  35. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Unfortunately that's not working for me. I have the background color set to solid and 0,0,0,0, but it just shows up all black :/
     

    Attached Files:

  36. Josh-Armour

    Josh-Armour

    Joined:
    Aug 8, 2014
    Posts:
    6
    Hey, was looking because of the same issue, and seemed to find the solution for me based on these posts. Basically I found that you need to change the background alpha on the skybox color in the camera. It is by default set to something like 10% and if you change the alpha on the main camera to 255 the rawimage looks solid
     
  37. Josh-Armour

    Josh-Armour

    Joined:
    Aug 8, 2014
    Posts:
    6
    Never mind... this does not seem to fully work with transparent items and terrain....

    EDIT: Found this http://varuagdiary.blogspot.com/2012_01_01_archive.html

    When using this java script in the camera producing the render texture, it makes the transparent and terrain issue be fixed. (Alpha option set to 1). I did turn off the GUI Layer on the camera too, though that may be related to a different issue.
     
    Last edited: Dec 16, 2014
  38. byrne

    byrne

    Joined:
    Sep 23, 2014
    Posts:
    7
    i believe I might have found the solution for my problem at least. I will describe my problem and the fix below:

    I attempted to use uGUI's RawImage to display a RenderTexture. This RenderTexture is displaying the output of a camera that shows a simple unity particle system flare. After setting it up, I was experiencing weird artifacts, and couldn't figure out why.

    The resulting setup solved the depth artifacts for me:

    1. Camera > "Solid Color" + Culling Mask on Particle system Layer + Target Texture(myRenderTexture)

    2. Particle system: Change shader from "Particles/Additive" to "Mobile/Particles/Additive"

    3. RawImage: Show myRenderTexture


    Remember the rawimage needs to be on a canvas to be shown.

    Hope this helps!
     
    andytlin74 likes this.
  39. Tee_Pee

    Tee_Pee

    Joined:
    Aug 18, 2013
    Posts:
    54
    Guys, I had the same issue and found that giving my RawImage a material set to Particles/Alpha Blended Premultiply solved the issue.
     
  40. infinitypbr

    infinitypbr

    Joined:
    Nov 28, 2012
    Posts:
    2,937
    Using "Particles/Alpha Blended Premultiply" along with "Solid Color" (0,0,0,0) on the camera worked to some degree. The artifacts in the background were gone. However any particles on my weapons/armor would show up incorrectly and some objects were crazy bright.

    Returning the material setting to unlit-texture keeps the black background visible, but unlit-transparent somehow removes the weapon from the view (has the slight outlined look as in one of the more original posts).

    Other mobile/particle/multiply etc has a look I'd be down with, but the weapon is always transparent mostly. It has the same shader as the player model.
     
  41. Tee_Pee

    Tee_Pee

    Joined:
    Aug 18, 2013
    Posts:
    54
    You are correct, I only had one solid object hence why Particle/Alpha Blended Premultiply worked. I thought of a temporary bandaid solution, but it's as efficient as killing a fly with a rocket launcher:

    -Have a normal render texture with the content you need projected on a plane.
    -Have a second render texture recording that plane set to Particles/Alpha Blended Premultiply attached to a RawImage.

    This SHOULD give you the proper look, although it's stupidly wrong.
     
    infinitypbr likes this.
  42. bagofbeans

    bagofbeans

    Joined:
    Sep 17, 2013
    Posts:
    2
    Has anyone found a proper fix for this issue?
     
  43. byrne

    byrne

    Joined:
    Sep 23, 2014
    Posts:
    7
    This post is about trying to remove the background of a render texture after a camera has rendered to it.

    I was trying my best to use a depth camera that outputs to a render texture, and these are my findings:

    1. A Camera set to solidcolor-black that outputs to a rendertexture
    2. A rawimage ui gameobject child of a canvas overlay gameobject
    4. Use a material that has the attached OverlayBlend shader on it
    4. Put the rendertexture onto the material, then put the material onto the rawimage.
    (leave the rawimage texture field blank because it is the material that shows the texture)

    This might put a bit of a damper on FPS, but it achieves the transparency effect of a rendertotexture camera.

    I found that using 'depth' or 'don't clear' would just leave ghost images, so solid color is the best for this technique.

    The shader achieves the 'Overlay' image effect just like photoshop. Might be good for minimaps.
     

    Attached Files:

    karmington2 likes this.
  44. Moohasha

    Moohasha

    Joined:
    Jul 8, 2013
    Posts:
    8
    I believe I have found a solution. It may be a little late for the OP, but may others will find this helpful. The way I fixed it was I added a material to the UI Raw Image element using the Unlit/Texture shader with the Render Texture as the texture. This fixed the problem of parts of the image being transparent for me.
     
  45. Riagan

    Riagan

    Joined:
    Feb 11, 2013
    Posts:
    7
    OMG. I am super excited, because I just got it to work for me... I had a black background on my Texture i needed to be transparent...
    1. Alpha from Grayscale checked
    2. Apply both Texture and material with Texture to raw image
    3. Use Legacy Shaders/Transparent/Cutout/Soft Edge Unlit

    This is exactly what i wanted. I hope this helps.
     
  46. brianasu

    brianasu

    Joined:
    Mar 9, 2010
    Posts:
    368
    Shader fix for alpha channels and sprites

    If anyone is still having trouble. I've attached a custom shader that ignores the alpha channel. You have to create a custom material switch to "UI/Default No Alpha" and apply it to the raw image.
     

    Attached Files:

    Last edited: Sep 18, 2015
    karmington2 likes this.
  47. awesomedata

    awesomedata

    Joined:
    Oct 8, 2014
    Posts:
    868
    No idea why nobody ever sent a bug report on this issue so it could be properly fixed by Unity.

    It's apparently been going on for a LONG time. Anyone still having this issue in v5.x ?
     
    kuchaku likes this.
  48. Kiwasi

    Kiwasi

    Joined:
    Dec 5, 2013
    Posts:
    16,557
    Why are we not just creating a sprite from the RenderTexture and using a regular image? Or am I missing something special about RenderTextures?

    Pseudo code

    Code (CSharp):
    1. RenderTexture texture;
    2. Image image;
    3. ...
    4. Sprite mySprite = Sprite.Create(Texture);
    5. image.sprite = mySprite;
     
  49. brianasu

    brianasu

    Joined:
    Mar 9, 2010
    Posts:
    368
    Isn't sprite separate from the ugui or am I missing something? RawImage should in theory handle alpha channels in rendertextures.
     
  50. Kiwasi

    Kiwasi

    Joined:
    Dec 5, 2013
    Posts:
    16,557
    The new UI system uses Sprites.
     
    twobob likes this.