Search Unity

  1. Megacity Metro Demo now available. Download now.
    Dismiss Notice
  2. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

Resolved UI elements rendering behind other scene elements

Discussion in 'UGUI & TextMesh Pro' started by MidniteOil, Dec 4, 2021.

  1. MidniteOil

    MidniteOil

    Joined:
    Sep 25, 2019
    Posts:
    345
    Greetings,

    In one of my game scenes I display a Game Over screen when the player dies. I fade the canvas renderer in using DOTween.

    Everything works great running in the editor but on the actual iPhone or WebGL deployed build it's rendering behind other elements.


    On the iPhone


    I've tried different z offsets, sort orders, etc.

    It's interesting that the Image on the panel layer is rendering over the scene elements (that's the dark background) but the text elements aren't.

    I'm at a loss at how to diagnose this since I'm unable to reproduce it in the editor.

    Any help would be appreciated.
     
    Last edited: Dec 6, 2021
  2. matiasini

    matiasini

    Joined:
    Mar 11, 2014
    Posts:
    8
    Did you solve it?
     
  3. MidniteOil

    MidniteOil

    Joined:
    Sep 25, 2019
    Posts:
    345
    I did. As I recall I added a Canvas Group to my GameOverPanel and also a script to set the canvas Sort Order
    upload_2023-6-1_11-36-25.png

    Code (CSharp):
    1. using UnityEngine;
    2.  
    3. namespace MidniteOilSoftware.NinjaEggs.MiniGames
    4. {
    5.     public class SetCanvasSortOrder : MonoBehaviour
    6.     {
    7.         [SerializeField] int _newSortOrder = 10;
    8.         Canvas _canvas;
    9.         int _oldSortOrder;
    10.         bool _oldOverrideSorting;
    11.  
    12.         private void OnEnable()
    13.         {
    14.             _canvas = GetComponentInParent<Canvas>();
    15.             _oldSortOrder = _canvas.sortingOrder;
    16.             _canvas.sortingOrder = _newSortOrder;
    17.             _oldOverrideSorting = _canvas.overrideSorting;
    18.             _canvas.overrideSorting = true;
    19.         }
    20.  
    21.         private void OnDisable()
    22.         {
    23.             _canvas.sortingOrder = _oldSortOrder;
    24.             _canvas.overrideSorting = _oldOverrideSorting;
    25.         }
    26.     }
    27. }