In-depth analysis of Canvas rendering mode

Detailed explanation of Canvas's renderMode requires specific code examples

In Unity, Canvas is the most basic and key component for implementing 2D UI. Canvas has two different modes during the rendering process: Screen Space and World Space. These rendering modes will be more suitable in specific situations, and we need to choose different modes based on project needs. In this article, we will focus on the two rendering modes of Canvas and how to use them.

1. Screen Space

Screen Space is the most basic rendering mode of Canvas. It renders directly to the screen and draws UI elements on the screen. When objects in the scene move or rotate, the positions of UI elements cannot follow the corresponding changes. Therefore, this mode is most suitable for fixed UI interfaces, such as the game's main menu, settings, etc.

1.1 Overlay mode

Overlay mode is a rendering mode of Screen Space. The UI elements in this mode will be in an independent layer in the scene and are not related to the ones in the scene. Interact with other 3D objects. When the camera moves, this layer of UI elements will always stay in front. In Overlay mode, the rendering order of the canvas is determined by the level of the canvas component in the hierarchy panel.

The following is the sample code:

public Canvas overlayCanvas;

void Start()
{
    overlayCanvas.sortingOrder = 10;
}

In this example, we determine the position of this canvas in the rendering queue by setting the sortOrder property of the canvas component.

1.2 Camera Mode

Camera mode is another common rendering mode in Screen Space. In Camera mode, UI elements are bound to an independent camera object, and the camera only renders objects related to the UI canvas instead of rendering the entire screen. This rendering mode is typically used when camera effects or occlusion are required.

The following is the sample code:

public Canvas cameraCanvas;

void Start()
{
    Camera camera = GetComponent<Camera>();
    camera.targetDisplay = 1;
    cameraCanvas.worldCamera = camera;
}

In this example, we create and set up an independent camera in the scene, and then assign the camera object to the worldCamera property of Canvas to let the UI The element only renders the area viewed through this camera.

2. World Space

World Space mode is another Canvas rendering mode, which is based on 3D space rendering. Compared with Screen Space mode, in World Space mode, UI elements will change accordingly as the objects in the scene move and rotate, and can interact with other 3D objects in the scene. In this case, the scene UI generally tends to be used during scene construction.

2.1 Overlay mode

Overlay mode also supports use in World Space. Compared with Screen Space Overlay, in World Space Overlay, the canvas and UI elements are in the same 3D space as the scene objects, and UI elements are rendered on the plane where the screen is located.

The following is the sample code:

public Canvas worldCanvas;

void Start()
{
    worldCanvas.renderMode = RenderMode.WorldSpace;
    worldCanvas.transform.position = new Vector3(0f, 0f, 10f);
}

In this example, we set the rendering mode of the Canvas component to WorldSpace to make the UI elements change with the objects in the scene.

2.2 Camera Mode

Camera mode is also applicable to World Space mode, and in some cases, using Camera mode can greatly optimize performance. In Camera mode, UI elements are only rendered in the visible area of ​​the camera bound to the Canvas. This relatively complex setting method makes the Camera mode very good in large UI operations in 3D scene UDP, such as camera actions, scene switching, etc.

The following is the sample code:

public Canvas worldCanvas;
public Camera canvasCamera;

void Start()
{
    worldCanvas.renderMode = RenderMode.WorldSpace;
    worldCanvas.worldCamera = canvasCamera;
}

In this example, we achieve a large number of by setting the rendering mode of the Canvas to WorldSpace, and then setting the Canvas' worldCamera to the bound Camera. The occasion for UI interaction and scene 3D operation.

Summary

Through the above explanation, we can know that Canvas has two rendering modes: Screen Space and World Space, and each mode supports two different rendering modes: Overlay and Camera. Rendering method. How to choose a rendering mode in a certain mode depends on the scene requirements of the application. I hope that through this article, everyone will have a more detailed understanding of the use of Canvas in Unity.

The above is the detailed content of In-depth analysis of Canvas rendering mode. For more information, please follow other related articles on the PHP Chinese website!