Wayback Machinekoobas.hobune.stream
May JUN Jul
Previous capture 12 Next capture
2021 2022 2023
1 capture
12 Jun 22 - 12 Jun 22
sparklines
Close Help
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
  • Asset Store
  • Get Unity

UNITY ACCOUNT

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account
  • Blog
  • Forums
  • Answers
  • Evangelists
  • User Groups
  • Beta Program
  • Advisory Panel

Navigation

  • Home
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
    • Blog
    • Forums
    • Answers
    • Evangelists
    • User Groups
    • Beta Program
    • Advisory Panel

Unity account

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account

Language

  • Chinese
  • Spanish
  • Japanese
  • Korean
  • Portuguese
  • Ask a question
  • Spaces
    • Default
    • Help Room
    • META
    • Moderators
    • Topics
    • Questions
    • Users
    • Badges
  • Home /
This question was closed Aug 28, 2019 at 07:32 PM by pigaroos for the following reason:

The question is answered

avatar image
0
Question by pigaroos · Aug 27, 2019 at 07:09 PM · 2duicanvasbackgroundui image

How do I make UI elements go behind my 2D game objects?

Hello everyone, as the background I have implemented a UI Image inside a canvas. However, it goes over all the game objects, killing the purpose of a background. It is a 2D scene, is the a way to render the background in the back?

Comment
Add comment · Show 3
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image I_Am_Err00r · Aug 28, 2019 at 06:46 PM -1
Share

I just checked my email and saw you reworded your question, and I will answer your question again right now because I don't think you saw my last response yesterday and just deleted the whole thread.


You need to change your Canvas Renderer to Screen Space Camera so you can change the sorting layer as well as order in layers, this will answer your question, is the easiest to setup, requires the least amount of CPU, and is just generally the recommended way to do exactly what you are asking.


Now that you worded the body of your question from "How do I display 2D objects behind my UI" to "How do I get my background to display", I understand the why now, and I would NEVER use a Canvas to display my background image, ins$$anonymous$$d I would use a sprite renderer to display a 2D sprite based background.


UI in general is not used to simply display images just like screw drivers are not meant to hammer nails, but both will get the job done. Think of using a Canvas (parent object of all UI) to only record player interaction with buttons, menus, sliders, things like that; sprite renderer (or mesh renderer for 3D) are the components used to display images and would make 1000% more sense to use a sprite renderer if you are just trying to show a background (even if it is a scrolling parallax background).


I did answer this question correctly within one answer and two clarifying comments later (and even apologized for not giving you a 100% complete answer the first round) and it is kind of frustrating to provide help on this forum and see people not take the advice and rather than ask "I'm doing what you are saying, it doesn't seem to work..." they just move on and ask for next answer; I have never seen anyone insult anyone for trying to learn on here, or reddit, or youtube, or anywhere and would say game dev community is super friendly and eager to help; I personally have a ton of patience for people who are willing to listen and learn and it's uplifting to see those moments when it starts to make sense for newbies; don't be so proud that you are afraid to ask for more information if something isn't making sense or working for you.


Anyway, hope this helps you out, and just be honest on this forum, don't be afraid that someone will call you out for not understanding an answer they provide, literally have never seen that anywhere.

avatar image pigaroos I_Am_Err00r · Aug 28, 2019 at 07:30 PM 0
Share

Hello @I_Am_Err00r , I am extremely grateful for your answer. To give a little bit of background (pun intented) I was opting for the sprite renderer solution you are talking about, but it wasn't completely practical as the camera zooms out at times, revealing what's beneath. Which took me to look for a way to display it as UI, so it's always the same size and displaying fully (there are obviously other ways to avoid that problem but the UI solution seemed the most straightforward). As for your answer, I foggily remember that you recommended to set the camera to World Space ins$$anonymous$$d of the supposed Screen Space Camera and something happened in the way that was making it act like a sprite. So I edited the question to bump it (literally added a space) and the other replies have been removed for some reason. Though upon reading this, I decided to try it again and it worked exactly as intended and I thank you. Sorry for the wall of text, the inconvenience, and my noobie brain.

avatar image I_Am_Err00r pigaroos · Aug 28, 2019 at 07:49 PM 1
Share

I lied about this being my last post :)

Thanks for not taking my venting personally, I'm having a rough day at work and I just took it out on you, so sorry, I'll reward you with 10 points for not taking it personal.

Here is the answer you have been seeking: https://kylewbanks.com/blog/create-fullscreen-background-image-in-unity2d-with-spriterenderer


I haven't tested this, but this is a fairly common issue and it looks like this tutorial walks you through so that regardless of camera zoom or position, the background will display.

1 Reply

  • Sort: 
avatar image
0

Answer by JedBeryll · Aug 28, 2019 at 04:24 PM

Hi

  1. Create new material

  2. Select shader for material: UI/Default

  3. Set render queue to something like 2300

  4. Assign this material to the image component's material slot

Make sure your camera clear flags are set to anything but skybox.

Comment
Add comment · Show 4 · Share
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image pigaroos · Aug 28, 2019 at 06:48 PM 0
Share

Hi

Upon trying this, I have noticed that this renders the image behind other UI, not behind the scene as intended for this image

avatar image JedBeryll pigaroos · Aug 28, 2019 at 06:54 PM 0
Share

Are you sure you followed all steps? I have just tried this and it works for me. Backgroudn is behind everything and ui is over 3D objects.

avatar image pigaroos JedBeryll · Aug 28, 2019 at 07:13 PM 0
Share

I followed everything just right. Also, it might be that your scene is 3D and $$anonymous$$e is 2D

avatar image I_Am_Err00r pigaroos · Aug 28, 2019 at 07:22 PM -1
Share

Ok, I'm going to leave you alone after this post, but seriously why are you using a Canvas to display an image? How are your other 2D objects renderered? Are you using a Canvas to display all of your objects? Do any of your objects have a Sprite Renderer? Who taught you this or why did you decide to go this route?


I know you're trying to help @JedBeryll, but given your reputation (karma) you should know that adding a material isn't the most optimal, manageable, and newbie friendly way to go about this and that using a Screen Space Camera render mode for UI and then order the layers from there is (which is the first answer you provided I saw in the email about this thread, but I guess you deleted when you saw my previous comments telling @pigaroos to do that); however, the real problem is @pigaroos is using UI to display background images and we both know that a sprite renderer would be the best route to do that, despite the question asked by OP.


Alright, I'm out of this thread, best of luck to you @pigaroos.

Follow this Question

Answers Answers and Comments

275 People are following this question.

avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image

Related Questions

2D UI in 3D space 3 Answers

Unity 2D not rendering images in Canvas 1 Answer

Canvas Screen Space Issue 1 Answer

How to change UI image render order dynamically on runtime 1 Answer

UI Image size 1 Answer


Enterprise
Social Q&A

Social
Subscribe on YouTube social-youtube Follow on LinkedIn social-linkedin Follow on Twitter social-twitter Follow on Facebook social-facebook Follow on Instagram social-instagram

Footer

  • Purchase
    • Products
    • Subscription
    • Asset Store
    • Unity Gear
    • Resellers
  • Education
    • Students
    • Educators
    • Certification
    • Learn
    • Center of Excellence
  • Download
    • Unity
    • Beta Program
  • Unity Labs
    • Labs
    • Publications
  • Resources
    • Learn platform
    • Community
    • Documentation
    • Unity QA
    • FAQ
    • Services Status
    • Connect
  • About Unity
    • About Us
    • Blog
    • Events
    • Careers
    • Contact
    • Press
    • Partners
    • Affiliates
    • Security
Copyright © 2020 Unity Technologies
  • Legal
  • Privacy Policy
  • Cookies
  • Do Not Sell My Personal Information
  • Cookies Settings
"Unity", Unity logos, and other Unity trademarks are trademarks or registered trademarks of Unity Technologies or its affiliates in the U.S. and elsewhere (more info here). Other names or brands are trademarks of their respective owners.
  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Spaces
  • Default
  • Help Room
  • META
  • Moderators
  • Explore
  • Topics
  • Questions
  • Users
  • Badges