Search Unity

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

Question Object & UI Ordering & Sorting in 3D Space

Discussion in 'Editor & General Support' started by JensenChua, Oct 25, 2023.

  1. JensenChua

    JensenChua

    Joined:
    Aug 29, 2023
    Posts:
    3
    Hi,

    May I seek some help on ordering and sorting 3D objects and UI?
    I have 2 cubes, a white "Cube (1)" and red cube and a canvas containing an image and a textMeshPro text in the middle.

    The canvas and its contents are nested under an empty "GameObject" which is nested under the red cube and "Belongs" to the red cube.
    The purpose of the empty "GameObject" is to allow the canvas and its contents to orbit around the red cube if the camera rotates and it is scripted such that the canvas always faces the camera when the camera is rotated.
    The problem that I encountered is that, somehow the canvas with its image and the text keeps going behind the white cube. It is ok for the canvas to appear behind the red cube but not the white cube. 25Oct2023 - 3D Space UI Sorting.png

    I tried putting the cubes and the canvas on different layers and define a sorting order, but nothing seemed to work.

    While I understand that putting the canvas Render Mode in Screen Space Overlay/Camera might help, but I do not want the canvas and its contents to follow and stay on screen if the 3D objects disappear off screen due to panning the camera. I.e. The canvas and the UI contents should follow and act as a label for the red cube.

    Could anyone kindly please advise?

    Thank you.
     
  2. Kurt-Dekker

    Kurt-Dekker

    Joined:
    Mar 16, 2013
    Posts:
    38,235
    Three (3) primary ways that Unity draws / stacks / sorts / layers / overlays stuff:

    https://forum.unity.com/threads/orthographic-camera-rendering-order.1114078/#post-7167037

    In short, as far as the Standard Rendering Pipeline,

    1. The default 3D Renderers draw stuff according to Z depth - distance from camera.

    2. SpriteRenderers draw according to their Sorting Layer and Sorting Depth properties

    3. UI Canvas Renderers draw in linear transform sequence, like a stack of papers

    If you find that you need to mix and match items using these different ways of rendering, and have them appear in ways they are not initially designed for, you need to:

    - identify what you are using
    - search online for the combination of things you are doing and how to to achieve what you want.

    There may be more than one solution to try.

    For instance, you may even use multiple co-located cameras to more-explicitly control apparent draw ordering.

    Additional reading in the official docs:

    https://docs.unity3d.com/Manual/2DSorting.html

    And SortingGroups can also be extremely helpful in certain circumstances:

    https://docs.unity3d.com/Manual/class-SortingGroup.html

    Other rendering pipelines may have other ways of layering (HDRP and URP). Go see the latest docs for details.

    There's lots of third party open source packages available as well, such as this:

    https://github.com/mob-sakai/ParticleEffectForUGUI
     
    JensenChua likes this.
  3. JensenChua

    JensenChua

    Joined:
    Aug 29, 2023
    Posts:
    3
    Thank you very much for your detailed response. I'll take some time to look through the resources you've shared. Most likely going to explore "SortingGroups" first since I've already experimented with quite a bit of layering and 2D sorting based on recommendations found in various videos related to object layering and sorting, although majority of them covered the sorting of 2D sprites against 2D sprites.
     
    Kurt-Dekker likes this.
  4. JensenChua

    JensenChua

    Joined:
    Aug 29, 2023
    Posts:
    3
    Hi,

    So I tried some methods to cope with the sorting.
    - Sorting Groups, setting the white cube to a "Background" layer while for the text, I tried both the default layer and creating a "Top" layer. Nevertheless, the same issue remains.
    - I tried using the 2D sorting mechanism by adding Sprite Renderers and using the Sorting in the Additional Settings, but that also didn't work out.
    - Since the text is in a canvas is nested in an "Empty" centered in the red cube, I made changes to the "Sorting Layer" value of the canvas. While it did not resolve the issue in the main thread, it did seem to solve some other display issues.

    May I enquire if there are other approaches to this? Unfortunately, I was not able to implement any third party packages as of now. Meanwhile I forgot I'd missed out testing an additional camera, so I'll try it now and update this thread.

    Thank you in advance.
     
    Last edited: Oct 30, 2023