Up to date

This page is up to date for Godot 4.2. If you still find outdated information, please open an issue.

Theme-Typ-Variationen

Bei der Gestaltung einer Benutzeroberfläche kann es vorkommen, dass ein Control-Node ein anderes Aussehen haben muss als eines, das normalerweise durch ein Theme definiert ist. Jeder Control-Node hat Überschreibungen der Theme-Property, die es Ihnen ermöglichen, das Styling für jedes einzelne UI-Element neu zu definieren.

../../_images/themecheck.png

Dieser Ansatz wird schnell schwierig zu handhaben, wenn mehrere Controls dasselbe benutzerdefinierte Aussehen haben sollen. Stellen Sie sich vor, dass Sie in Ihrem Projekt graue, blaue und rote Varianten von Button verwenden. Die Einrichtung jedes Mal, wenn Sie ein neues Button-Element zu Ihrer Benutzeroberfläche hinzufügen, wird zu einer mühsamen Aufgabe.

Um die Organisation zu erleichtern und die Möglichkeiten von Themes besser zu nutzen, können Sie Variationen von Themes verwenden. Diese funktionieren wie normale Theme-Typen, aber anstatt unabhängig und eigenständig zu sein, erweitern sie einen anderen, Basistypen.

In Anlehnung an das vorhergehende Beispiel kann Ihr Theme einige Stile, Farben und Schriftarten für den Typ Button definieren und so das Aussehen jedes Button-Elements in Ihrer Benutzeroberfläche anpassen. Um dann einen grauen, roten oder blauen Button zu haben, würden Sie einen neuen Typ erstellen, z.B. GrayButton, und ihn als eine Variation des Basis-Typs Button markieren.

Typvariationen können einige Aspekte des Basistyps ersetzen, andere jedoch beibehalten. Sie können auch Propertys definieren, die der Basisstil nicht definiert hat. Zum Beispiel kann Ihr GrayButton den normal Stil des Basistyps Button überschreiben und font_color hinzufügen, den Button nie definiert hat. Das Control wird eine Kombination aus beiden Typen verwenden, wobei die Typvariation Vorrang hat.

Bemerkung

Die Art und Weise, wie Controls auflösen, welche Theme-Elemente sie von jedem Typ und jedem Theme verwenden, wird besser im Abschnitt Anpassen eines Projekts des Artikels "Einführung in das GUI-Skinning" beschrieben.

Erstellen einer Typvariation

Um eine Typ-Variation zu erstellen, öffnen Sie den Theme-Editor und klicken Sie dann auf das Plus-Symbol neben dem Dropdown-Menü Typ auf der rechten Seite des Editors. Geben Sie in das Textfeld ein, wie Sie die Variation des Theme-Typs nennen möchten, und klicken Sie dann auf Typ hinzufügen.

Unter dem Dropdown-Menü Typ befinden sich die Tabs für die Propertys. Wechseln Sie zum Tab mit dem Schraubenschlüssel- und Schraubendrehersymbol.

../../_images/base_type.png

Klicken Sie auf das Plus-Symbol neben dem Feld Basistyp. Dort können Sie den Basistyp auswählen, der normalerweise der Name einer Contol-Node-Klasse ist (z.B. Button, Label, usw.). Typvariationen können auch andere Typvariationen verketten und erweitern. Dies funktioniert auf die gleiche Weise, wie Control-Nodes das Styling ihrer Basisklasse erben. Zum Beispiel erbt CheckButton die Stile von Button, weil die entsprechenden Node-Typen sich gegenseitig erweitern.

Nachdem Sie den Basistyp ausgewählt haben, sollten Sie nun seine Propertys auf den anderen Tabs des Theme-Editors sehen können. Sie können sie wie gewohnt bearbeiten.

Verwendung einer Typvariation

Nachdem Sie nun eine Typvariation erstellt haben, können Sie diese auf Ihre Nodes anwenden. Im Inspektor-Dock finden Sie unter der Property Theme eines Control-Nodes die Property Theme-Typ-Variation. Sie ist standardmäßig leer, was bedeutet, dass nur der Basistyp Auswirkungen auf diesen Node hat.

Sie können eine Typvariation entweder aus einer Dropdown-Liste auswählen oder ihren Namen manuell eingeben. Variationen erscheinen nur dann in der Liste, wenn die Typvariation zum projektweiten Theme gehört, das Sie in den Projekteinstellungen konfigurieren können. In allen anderen Fällen müssen Sie den Namen der Variante manuell eingeben. Klicken Sie auf das Bleistift-Symbol auf der rechten Seite. Geben Sie dann den Namen der Typvariation ein und klicken Sie auf das Häkchen-Icon oder drücken Sie die Eingabetaste. Wenn eine Typvariation mit diesem Namen existiert, wird sie nun vom Node verwendet.