Unity: UI Workflow Improvement

 

If you build a game in Unity you will need a few UI screens to guide your player. The number of canvases will increase with the complexity and size of your project.

 

The canvases and the UI graphics will start to clutter your scene view because canvases are not moveable. This leads to a bad editing workflow and version control noise if you fall back to disable/enable the canvases that you want to edit.

 

This problem can be solved by parenting a new panel game object right beneath the canvas, set it to stretch and move it out of the way. This is the new parent game object for your UI graphics. 

 

Default Setup

 

 

Improved Setup

 

The panel positions need to be reset in the beginning to make them visible again. This can be done in a custom build process or in a simple script that resets the position in awake. The script must be placed on the offset game object.

 

Example

 

using UnityEngine;

/// <summary>
/// Used on RectTransform panels which are moved away from their default
/// position in the scene view to organize UI screens for editing.
/// At runtime, the anchored position is set back to zero.
/// </summary>
public class ResetRectTransform : MonoBehaviour
{
  private void Awake()
  {
    var rectTransform = (RectTransform)transform;
    rectTransform.offsetMin = Vector2.zero;
    rectTransform.offsetMax = Vector2.zero;
  }
}