Heim >Web-Frontend >HTML-Tutorial >Eingehende Analyse des Canvas-Rendering-Modus

Eingehende Analyse des Canvas-Rendering-Modus

PHPz
PHPzOriginal
2024-01-17 09:32:13918Durchsuche

Eingehende Analyse des Canvas-Rendering-Modus

Detaillierte Erläuterung des renderMode von Canvas, spezifische Codebeispiele sind erforderlich

In Unity ist Canvas die grundlegendste und wichtigste Komponente für die Implementierung der 2D-Benutzeroberfläche. Canvas verfügt während des Rendervorgangs über zwei verschiedene Modi: Bildschirmraum und Weltraum. Diese Rendering-Modi sind für bestimmte Situationen besser geeignet, und wir müssen je nach Projektanforderungen unterschiedliche Modi auswählen. In diesem Artikel konzentrieren wir uns auf die beiden Rendering-Modi von Canvas und deren Verwendung.

  1. Screen Space

Screen Space ist der grundlegendste Rendering-Modus von Canvas. Er rendert direkt auf dem Bildschirm und zeichnet UI-Elemente auf dem Bildschirm. Wenn sich Objekte in der Szene bewegen oder drehen, können die Positionen von UI-Elementen den entsprechenden Änderungen nicht folgen. Daher eignet sich dieser Modus am besten für feste Benutzeroberflächen wie das Hauptmenü, die Einstellungen usw. des Spiels.

1.1 Overlay-Modus

Der Overlay-Modus ist ein Rendering-Modus von Screen Space. Die UI-Elemente in diesem Modus befinden sich in einer unabhängigen Ebene in der Szene und interagieren nicht mit anderen 3D-Objekten in der Szene. Wenn sich die Kamera bewegt, bleibt diese Ebene mit UI-Elementen immer im Vordergrund. Im Overlay-Modus wird die Renderreihenfolge der Leinwand durch die Ebene der Leinwandkomponente im Hierarchiebereich bestimmt.

Das Folgende ist der Beispielcode:

public Canvas overlayCanvas;

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

In diesem Beispiel bestimmen wir die Position dieser Leinwand in der Rendering-Warteschlange, indem wir die sortOrder-Eigenschaft der Leinwandkomponente festlegen.

1.2 Kameramodus

Der Kameramodus ist ein weiterer gängiger Rendering-Modus im Screen Space. Im Kameramodus sind UI-Elemente an ein unabhängiges Kameraobjekt gebunden und die Kamera rendert nur Objekte, die sich auf die UI-Leinwand beziehen, anstatt den gesamten Bildschirm zu rendern. Dieser Rendering-Modus wird normalerweise verwendet, wenn Kameraeffekte oder Okklusion erforderlich sind.

Das Folgende ist der Beispielcode:

public Canvas cameraCanvas;

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

In diesem Beispiel erstellen und richten wir eine unabhängige Kamera in der Szene ein und weisen dann das Kameraobjekt der worldCamera-Eigenschaft des Canvas zu, sodass das UI-Element nur die Bilder rendert durch den Kamerabereich beobachtet.

  1. Weltraum

Der Weltraummodus ist ein weiterer Canvas-Rendering-Modus, der auf 3D-Raumrendering basiert. Im Vergleich zum Screen Space-Modus ändern sich im World Space-Modus die UI-Elemente entsprechend, wenn sich die Objekte in der Szene bewegen und drehen, und können mit anderen 3D-Objekten in der Szene interagieren. In diesem Fall wird die Szenen-Benutzeroberfläche im Allgemeinen während der Szenenerstellung verwendet.

2.1 Overlay-Modus

Der Overlay-Modus wird auch im Weltraum unterstützt. Im Vergleich zum Screen Space Overlay befinden sich bei World Space Overlay die Leinwand und die UI-Elemente im selben 3D-Raum wie die Szenenobjekte, und UI-Elemente werden auf der Ebene gerendert, auf der sich der Bildschirm befindet.

Hier ist der Beispielcode:

public Canvas worldCanvas;

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

In diesem Beispiel stellen wir den Rendering-Modus der Canvas-Komponente auf WorldSpace ein, damit sich die UI-Elemente mit den Objekten in der Szene ändern.

2.2 Kameramodus

Der Kameramodus eignet sich auch für den Weltraummodus. In einigen Fällen kann die Verwendung des Kameramodus die Leistung erheblich optimieren. Im Kameramodus werden UI-Elemente nur im sichtbaren Bereich der an die Leinwand gebundenen Kamera gerendert. Diese relativ komplexe Einstellungsmethode macht den Kameramodus sehr gut für große UI-Vorgänge in 3D-Szenen-UDP, wie Kameraaktionen, Szenenwechsel usw.

Das Folgende ist der Beispielcode:

public Canvas worldCanvas;
public Camera canvasCamera;

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

In diesem Beispiel setzen wir den Rendering-Modus von Canvas auf WorldSpace und dann die worldCamera von Canvas auf die gebundene Kamera, um eine große Anzahl von UI-Interaktionen und Szenen-3D-Vorgängen zu erreichen. .

Zusammenfassung

Anhand der obigen Erklärung können wir erkennen, dass Canvas über zwei Rendering-Modi verfügt: Screen Space und World Space, und jeder Modus unterstützt zwei verschiedene Rendering-Methoden: Overlay und Camera. Die Auswahl eines Rendering-Modus in einem bestimmten Modus hängt von den Szenenanforderungen der Anwendung ab. Ich hoffe, dass jeder durch diesen Artikel ein detaillierteres Verständnis für die Verwendung von Canvas in Unity erhält.

Das obige ist der detaillierte Inhalt vonEingehende Analyse des Canvas-Rendering-Modus. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn