Der integrierte Stil-Editor ist ein umfassendes Tool, mit dem Sie UI-Stile für Roblox-Spiele durch eine Kombination aus Tokens, Designblättern, Stilregeln und Themen erstellen, verwalten und anwenden können.
Greifen Sie über die UI-Registerkarte auf den Stil-Editor zu.
Sobald Sie den Editor geöffnet haben, klicken Sie auf die Schaltfläche Design erstellen, um ein Basistilset zu generieren.
Das Erstellen eines Designstilsets über den Stil-Editor generiert ein BaseStyleSheet in einem Design-Ordner innerhalb von ReplicatedStorage. Dieses Basissheet synchronisiert spezifische engine‑level Standardwerte wie den Color3 Standard von [163, 162, 165] mit Standardwerten, die aus Einfüge-Workflows im Studio stammen. Es wird dringend empfohlen, dass Sie das Basissheet nicht löschen oder versuchen, es zu ändern — stattdessen sollten Sie Tokens und Stilregeln um ein Designblatt herum aufbauen, um Ihre UI-Ziele zu erreichen.
Zusätzlich wird ein StyleSheet-Blatt im Design-Ordner generiert, das eine StyleDerive zum Basissheet enthält. Wenn Sie diese StyleDerive entfernen, können ungestylte Werte für GuiObjects unerwartete Werte annehmen, zum Beispiel einen Standardwert Size von 0, 0, 0, 0.
Stil-Tokens
Stil Tokens, die durch Attribute eines Token StyleSheet definiert sind, repräsentieren UI-Eigenschaftsvariablen, die in verschiedenen Stilen und Komponenten verwendet werden können; zum Beispiel könnte es eine gemeinsame Farbe für Frame.BackgroundColor3, TextLabel.TextColor3 und UIStroke.Color geben. Tokens sind vergleichbar mit CSS-Variablen.
Obwohl sie für das UI-Design nicht erforderlich sind, werden Tokens für erweiterbares UI-Design und Stilaktualisierungen im Laufe der Zeit dringend empfohlen. Sie sollten damit beginnen, die folgenden Tokens zu erstellen, um zu verstehen, wie sie mit anderen Aspekten des universellen Stylings verbunden sind.
Erstellen Sie ein neues Token-Stilblatt:
- Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über Tokens, klicken Sie auf das ⊕ und wählen Sie Neues Token Stilblatt.
- Benennen Sie das neue Blatt in TokenSheet um.
Wählen Sie das neue Token-Blatt aus und erstellen Sie mehrere Tokens, indem Sie im Hauptbereich auf Token hinzufügen… klicken. Diese Tokens werden in diesem Leitfaden sowohl für Regeln als auch für Themen verwendet.
Token-Name Typ Wert Gold Color3 #ffcc00 Magenta Color3 #ff0099 Orange Color3 #dd6030 Oswald Font Oswald Rad20 UDim 0, 20 RectL UDim2 0, 300, 0, 160 SquareL UDim2 0, 200, 0, 200 Text24 number 24 Text32 number 32 
Designblätter
Ein Designstilblatt aggregiert Stilregeln und kann mit DataModel-Bäumen verknüpft werden, um Stil-Eigenschaften auf UI-Instanzen anzuwenden. Nur ein StyleSheet kann auf einen bestimmten Baum angewendet werden, obwohl Sie Themen verwenden können, um verwandte Stile in Ihrer UI auszutauschen, ein Konzept, das später in diesem Leitfaden behandelt wird.
Ein vorbefülltes Designblatt mit dem Namen StyleSheet wird über die Schaltfläche Design erstellen erstellt. Es enthält Klassenregeln für gängige UI-Objekte wie Frame und TextLabel. Es enthält auch zwei StyleDerive-Instanzen, die Tokens und Stile vom Basissheet für die Verwendung in Ihren benutzerdefinierten Stilkonfigurationen ableiten (erben).
Sobald Sie ein Designblatt haben, können Sie einen Test-On-Screen-Container einrichten, den Sie mit dem Stil-Editor verwenden, oder einen In-Game-Container, wenn gewünscht.
Bewegen Sie den Mauszeiger über StarterGui im Explorer und fügen Sie ein ScreenGui ein.
Bestätigen Sie, dass eine neue StyleLink-Instanz unter dem ScreenGui erscheint, deren StyleSheet-Eigenschaft auf das StyleSheet-Designblatt gesetzt ist.
Wenn die StyleLink nicht erstellt wird, können Sie schnell eine erstellen, indem Sie das ScreenGui im Explorer sowie das StyleSheet-Designblatt im linken Bereich des Stil-Editors auswählen. Klicken Sie dann auf die Schaltfläche StyleLink einfügen im oberen rechten Bereich des Hauptbereichs des Editors.
Stilregeln
Stil regeln gelten für jede Instanz, die der Definition des Selectors der Regel entspricht, um Merkmale wie Klassennamen, Instanz-Tags und Hierarchiebeziehungen abzugleichen. Auf einer hohen Ebene funktioniert das Abgleichen und Modifizieren von Instanzen über die Definition des Selectors einer Regel durch:
- Roblox Klassen-Selektoren, die alle Instanzen einer bestimmten UI-Klasse anvisieren, z. B. Frame, ImageLabel, TextButton usw.
- Instanz-Tag-Selektoren, die spezifische UI-Objekte anvisieren, die über CollectionService getaggt wurden.
- Instanznamen-Auswahl gemäß dem Wert des Instance.Name des UI-Objekts.
Klassenregel
Ein Stil Klassen-Selektor zielt auf alle Instanzen einer bestimmten UI-Klasse ab. Die folgende Regelkonfiguration stylt alle Frames mit einer einheitlichen Hintergrundfarbe und Größe.
Wählen Sie im linken Bereich des Stil-Editors Frame im UI Elements-Zweig aus.
Verknüpfen Sie zwei zuvor erstellte Stil-Tokens mit zwei Frame-Eigenschaften:
Eigenschaft Stil-Token BackgroundColor3 $Magenta Size $SquareL - Klicken Sie im Hauptbereich auf Eine Eigenschaft hinzufügen… und wählen Sie die erforderliche Eigenschaft aus. Beachten Sie, dass Sie Schlüsselwörter eingeben können, um Eigenschaften im Dropdown-Menü schneller zu finden.
- Anstatt einen statischen Wert einzugeben, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Token verknüpfen.
- Klicken Sie auf das $, das im Wertfeld erscheint, und wählen Sie das entsprechende zugehörige Token aus.
Fügen Sie ein neues Frame in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben. Die von Ihnen definierten Stile sollten automatisch auf es angewendet werden.
Tag-Regel
Instanz Tag-Selektoren zielen auf spezifische UI-Objekte ab, die über CollectionService getaggt wurden. Die folgende Regelkonfiguration stylt einen TextButton, der als ButtonPrimary mit einer benutzerdefinierten Hintergrundfarbe, Schriftart und Textgröße getaggt ist.
Wählen Sie im linken Bereich des Stil-Editors den StyleSheet-Blatt aus, klicken Sie auf die Schaltfläche ⋮ und navigieren Sie zu Neu ⟩ Tag.
Benennen Sie die neue Tag-Regel in .ButtonPrimary um (beachten Sie das führende .).
Verknüpfen Sie drei zuvor erstellte Stil-Tokens mit drei TextButton-Eigenschaften:
Eigenschaft Stil-Token BackgroundColor3 $Gold FontFace $Oswald TextSize $Text32 - Klicken Sie im Hauptbereich auf Eine Eigenschaft hinzufügen… und wählen Sie die erforderliche Eigenschaft aus. Denken Sie daran, dass Sie Schlüsselwörter eingeben können, um Eigenschaften im Dropdown-Menü schneller zu finden.
- Anstatt einen statischen Wert einzugeben, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Token verknüpfen.
- Klicken Sie auf das $, das im Wertfeld erscheint, und wählen Sie das entsprechende zugehörige Token aus.
Fügen Sie einen neuen TextButton in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben, und taggen Sie ihn als ButtonPrimary. Ein praktischer Shortcut ist wie folgt:
- Stellen Sie sicher, dass der neue TextButton im Explorer ausgewählt ist.
- Wählen Sie die .ButtonPrimary-Tag-Regel im linken Bereich des Stil-Editors aus und klicken Sie im Hauptbereich auf Tag anwenden. Die von Ihnen definierten Stile sollten automatisch auf die Schaltfläche angewendet werden.
UI-Modifier
Instanz-Modifier-Selektoren wenden phantome UIComponents wie UICorner oder UIStroke an, um ein Objekt weiter zu stylen. Die folgende Regelkonfiguration stylt ein TextLabel mit einer benutzerdefinierten Textgröße und abgerundeten Ecken.
Wählen Sie im linken Bereich des Stil-Editors TextLabel im UI Elements-Zweig aus.
Verknüpfen Sie ein zuvor erstelltes Stil-Token mit der TextSize-Eigenschaft:
- Klicken Sie im Hauptbereich auf Eine Eigenschaft hinzufügen… und wählen Sie die TextSize-Eigenschaft aus. Denken Sie daran, dass Sie Schlüsselwörter eingeben können, um Eigenschaften im Dropdown-Menü schneller zu finden.
- Anstatt einen statischen Wert einzugeben, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Token verknüpfen.
- Klicken Sie auf das $, das im Wertfeld erscheint, und wählen Sie das $Text32-Token aus.
Ein Pseudo-Element ist erforderlich, um abgerundete Ecken auf andere Elemente anzuwenden. Um eines zu erstellen:
Bewegen Sie im linken Bereich den Mauszeiger über TextLabel, klicken Sie auf die Schaltfläche ⋮ und navigieren Sie zu Neu ⟩ Pseudo Instance ⟩ UICorner.
Ein neues UICorner-Pseudo-Element erscheint unter dem TextLabel-Element im linken Bereich.
Wählen Sie das neue UICorner-Element im linken Bereich aus und verknüpfen Sie ein zuvor erstelltes Stil-Token mit der CornerRadius-Eigenschaft:
- Klicken Sie im Hauptbereich auf Eine Eigenschaft hinzufügen… und wählen Sie die CornerRadius-Eigenschaft aus.
- Anstatt einen statischen Wert einzugeben, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Token verknüpfen.
- Klicken Sie auf das $, das im Wertfeld erscheint, und wählen Sie das $Rad20-Token aus.
Fügen Sie ein neues TextLabel in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben. Die von Ihnen definierten Stile sollten automatisch auf es angewendet werden.
Zustandsregel
GuiObject Zustands-Selektoren entsprechen einem der vier GuiState-Enum-Werte wie Hover, sodass Sie automatisch Stiländerungen für interaktive Zustände konfigurieren können. Die folgende Regelkonfiguration erstellt einen Hover-Zustand mit einer Rotation von -4 Grad für alle ImageButtons.
Wählen Sie im linken Bereich des Stil-Editors ImageButton im UI Elements-Zweig aus.
Klicken Sie auf die Schaltfläche ⋮ und navigieren Sie zu Neu ⟩ GuiState ⟩ Hover.
Eine neue Hover-Zustandsmodifikatorinstanz erscheint unter dem ImageButton-Element im linken Bereich.
Wählen Sie den neuen Hover-Modifikator im linken Bereich aus, klicken Sie im Hauptbereich auf Eine Eigenschaft hinzufügen… und wählen Sie Rotation aus. Denken Sie daran, dass Sie Schlüsselwörter eingeben können, um Eigenschaften im Dropdown-Menü schneller zu finden.
Geben Sie -4 im Wertfeld der Eigenschaft ein.
Fügen Sie einen neuen ImageButton in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben. Wenn Sie mit der Maus über die Schaltfläche im Ansichtsfenster fahren, sollte sie sich um 4 Grad gegen den Uhrzeigersinn drehen.
Stilabfragen
Stil abfragen, ähnlich wie CSS-Container- und Medienabfragen, ermöglichen es Ihnen, bedingte Logik auf Ihre UI basierend auf der Containergröße, dem Eingabetyp oder anderen Faktoren anzuwenden. Der Stil-Editor bietet einen optimierten Workflow, um sowohl die Abfragelogik (Bedingungen) als auch die resultierenden Stile als einheitliches Set zu erstellen.
Eingebaute Abfragen
Einige StyleQuery-Bedingungen sind sehr häufig, wie das Ändern von Eigenschaften basierend auf der ViewportDisplaySize. Um dies zu vereinfachen, enthält der Stil-Editor eingebaute Abfragen, mit denen Sie bedingte Regeln erstellen können, ohne eine Pseudo- oder echte Instanz einer StyleQuery zu benötigen; stattdessen verwenden Sie einfach eine Abfrageregel mit einem vordefinierten Selektor wie ViewportDisplaySizeSmall.
Die folgenden Schritte zeigen, wie Sie eingebaute Abfragen für ein TextLabel generieren, um die Ansichtsgrößen Small, Medium und Large zu behandeln.
Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über TextLabel, klicken Sie auf die Schaltfläche ⋮ und navigieren Sie zu Neu ⟩ StyleQuery ⟩ Builtin ⟩ ViewportDisplaySize.
Dies erstellt einen Queries-Ordner unter der TextLabel-Regel, der drei Abfrageregeln enthält:
- @ViewportDisplaySizeLarge — Definieren Sie Eigenschaften, die gelten, wenn die Ansicht Large ist.
- @ViewportDisplaySizeMedium — Definieren Sie Eigenschaften, die gelten, wenn die Ansicht Medium ist.
- @ViewportDisplaySizeSmall — Definieren Sie Eigenschaften, die gelten, wenn die Ansicht Small ist.
Klicken Sie unter jeder Abfrageregel auf Eine Eigenschaft hinzufügen… und setzen Sie den spezifischen Text-String, der angezeigt werden soll, wenn diese Abfrage aktiv ist:
Um die Abfragen zu überprüfen, verwenden Sie den Geräteemulator, um zu testen, wie die UI auf verschiedene Auflösungen auf drei verschiedenen Geräten reagiert:
Ändern Sie das Gerät im Geräteemulator, um den Text in Echtzeit zu ändern.
Benutzerdefinierte Abfrage
Sie können einer bestehenden Regel eine Stilabfrage hinzufügen, um eine responsive UI zu erstellen, die sich an ihren Container anpasst. Die folgende Konfiguration konfiguriert ein TextLabel, um sein Erscheinungsbild automatisch zu ändern, wenn es sich auf eine Breite von 400 Pixel oder mehr ausdehnt.
Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über TextLabel, klicken Sie auf die Schaltfläche ⋮ und navigieren Sie zu Neu ⟩ StyleQuery ⟩ Custom.
Diese Aktion erstellt einen Queries-Ordner unter der TextLabel-Regel, der zwei verknüpfte Elemente enthält:
- ::StyleQuery-Pseudo-Instanzregel, in der Sie die Bedingungen definieren.
- @StyleQuery-Regel, in der Sie die Eigenschaften definieren, die angewendet werden sollen, wenn diese Bedingungen erfüllt sind.
Wählen Sie die übergeordnete TextLabel-Regel im Hauptbereich aus und definieren Sie die folgenden Standardwerte:
Eigenschaft Wert BackgroundColor3 $Magenta Text Standardtext Wählen Sie die ::StyleQuery-Regel im Hauptbereich aus, klicken Sie auf Eine Bedingung hinzufügen… und konfigurieren Sie Folgendes:
Bedingung Wert MinSize 400, 0 Siehe StyleQuery.IsActive als Referenz für andere Bedingungen, die über die ::StyleQuery-Regel verfügbar sind.
Wählen Sie die @StyleQuery-Regel im Hauptbereich aus und setzen Sie die Eigenschaften, die angewendet werden sollen, wenn die Abfrage aktiv ist:
Eigenschaft Wert BackgroundColor3 $Gold Text Großer Text
Um die Abfrage zu überprüfen, können Sie manuell ein TextLabel im Ansichtsfenster ändern.
Passen Sie seine Breite an, um den Stil in Echtzeit zu sehen.
Während die Breite des TextLabel kleiner ist, wird die MinSize-Bedingung nicht erfüllt und das Label verwendet seine Standardhintergrundfarbe und den Text.
Während das manuelle Ändern der Größe eine schnelle Möglichkeit ist, die responsive Logik zu überprüfen, können Sie auch die integrierten Emulationstools von Studio für genauere Tests verwenden:
- Verwenden Sie den Geräteemulator, um zu testen, wie Ihre UI auf bestimmte Bildschirmauflösungen und ViewportDisplaySize-Bedingungen reagiert.
- Verwenden Sie den Controller-Emulator, um die PreferredInput-Logik zu überprüfen, z. B. das Wechseln von Stilen, wenn ein Gamepad erkannt wird.
Stilübergänge
Stil übergänge, vergleichbar mit CSS-Übergängen, ermöglichen es Ihnen, Eigenschaftswerte über einen festgelegten Zeitraum zu tween.
Standard
Um viele UI-Eigenschaften mit denselben Parametern zu tween, können Sie einen Standardübergang festlegen, der auf alle Eigenschaften angewendet wird, es sei denn, ein anderer Übergang wird ausdrücklich für eine bestimmte Eigenschaft festgelegt.
Wählen Sie TextButton im UI Elements-Zweig aus und fügen Sie dann im Hauptbereich drei neue Eigenschaften mit den folgenden Werten hinzu:
Eigenschaft Wert AutoButtonColor false BackgroundColor3 #335FFF Rotation 0 
Bewegen Sie den Mauszeiger über die übergeordnete TextButton-Zeile, klicken Sie auf die Schaltfläche ⋮ und navigieren Sie zu Einfügen ⟩ Übergang.
Ein Standardübergang von 1, Quad, Out, 0 wird direkt unter der TextButton-Regel eingefügt, was auf einen Übergang von 1 Sekunde, eine Easing-Stil Quad, eine Easing-Richtung Out und keine Verzögerung hinweist.
Bewegen Sie den Mauszeiger über die übergeordnete TextButton-Zeile, klicken Sie auf die Schaltfläche ⋮ und navigieren Sie zu Neu ⟩ GuiState ⟩ Hover.
Fügen Sie für den neuen Hover-Modifikator zwei neue Eigenschaften als Ziele für den Hover-Zustand hinzu.
Eigenschaft Wert BackgroundColor3 #33AAFF Rotation -5 
Fügen Sie einen neuen TextButton in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben. Wenn Sie mit der Maus über die Schaltfläche im Ansichtsfenster fahren, sollte sie allmählich heller werden und sich um 5 Grad gegen den Uhrzeigersinn drehen.
Token-verknüpft
Um Übergangsverhalten über mehrere Regeln hinweg wiederzuverwenden, können Sie Tokens definieren, die den TweenInfo-Datentyp repräsentieren. Die folgende Regelkonfiguration erstellt einen Hover-Zustand, um alle TextButtons von -5 Grad Rotation und einer helleren Hintergrundfarbe zu tween.
Wenn Sie noch kein Token-Stilblatt erstellt haben, erstellen Sie ein Token-Stilblatt mit dem Namen TokenSheet.
Wählen Sie das neue Token-Blatt aus und erstellen Sie zwei neue Tokens, indem Sie im Hauptbereich auf Token hinzufügen… klicken.
Token-Name Typ Tween-Parameter CubicOut TweenInfo - Dauer = 1.25
- EasingStyle = Cubic
- EasingDirection = Out
- Verzögerung = 0
QuadInOut TweenInfo - Dauer = 0.5
- EasingStyle = Quad
- EasingDirection = InOut
- Verzögerung = 0
Wählen Sie TextButton im UI Elements-Zweig aus und fügen Sie dann im Hauptbereich drei neue Eigenschaften mit den folgenden Werten hinzu:
Eigenschaft Wert AutoButtonColor false BackgroundColor3 #335FFF Rotation 0 Für jede neue Eigenschaft, mit Ausnahme von AutoButtonColor, bewegen Sie den Mauszeiger über ihre Zeile, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Einfügen ⟩ Übergang.
Bewegen Sie den Mauszeiger über die neue Übergangs-Zeile unter jeder Eigenschaft, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Token verknüpfen. Klicken Sie dann anstelle eines statischen Wertes auf das $, das im Wertfeld erscheint, und wählen Sie das entsprechende Übergangstoken aus.
Eigenschaftsübergang Übergangstoken BackgroundColor3 $CubicOut Size $QuadInOut 
Bewegen Sie den Mauszeiger über die übergeordnete TextButton-Zeile, klicken Sie auf die Schaltfläche ⋮ und navigieren Sie zu Neu ⟩ GuiState ⟩ Hover.
Fügen Sie für den neuen Hover-Modifikator zwei neue Eigenschaften als Ziele für den Hover-Zustand hinzu.
Eigenschaft Wert BackgroundColor3 #33AAFF Rotation -5 Fügen Sie einen neuen TextButton in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben. Wenn Sie mit der Maus über die Schaltfläche im Ansichtsfenster fahren, sollte sie allmählich heller werden und sich um 5 Grad gegen den Uhrzeigersinn drehen.
Stilthemen
Stil themen bestehen aus Sets spezifischer Tokens, die ausgetauscht werden können, z. B. Farb-Tokens, die ein "helles" und "dunkles" Thema definieren.
Themen erstellen
Zur Erweiterbarkeit sind Themen in Ordnern organisiert. Während ein einzelner Ordner für die meisten Zwecke ausreichen kann, können Sie Themen auch in Ordnern wie "Farben" oder "Schriften" organisieren, wenn gewünscht.
Erstellen Sie einen neuen Themenordner:
- Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über Themes, klicken Sie auf das ⊕ und wählen Sie Neues Thema.
- Benennen Sie den neuen Ordner-Eintrag in Allgemein um.
Erstellen Sie ein neues Themenstilblatt:
- Bewegen Sie den Mauszeiger über den neuen Allgemein-Ordner, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Neues Themen Stilblatt.
- Benennen Sie es in ThemeA um.
Themen-Tokens
Sobald ein Thema erstellt wurde, können Sie seine Tokens mit verschiedenen UI-Objekteigenschaften verknüpfen, z. B. der BackgroundColor3 eines TextButton. Themenblätter müssen eine gemeinsame Menge von Tokens verwenden, um korrekt zu funktionieren.
Mit ThemeA, das im linken Bereich des Stil-Editors ausgewählt ist:
Verknüpfen Sie drei zuvor erstellte Stil-Tokens mit drei neuen Themen-Tokens:
Themen-Token Stil-Token BackColor $Gold ButtonFont $Oswald ButtonTextSize $Text32 - Klicken Sie im Hauptbereich auf Token hinzufügen… und geben Sie den Namen des Themen-Tokens ein.
- Klicken Sie auf das $, das im Wertfeld erscheint, und wählen Sie das zugehörige Stil-Token aus.
Wählen Sie im linken Bereich des Stil-Editors TextButton im UI Elements-Zweig aus.
Verknüpfen Sie die Tokens des Themas mit drei neuen TextButton-Eigenschaften:
Eigenschaft Themen-Token BackgroundColor3 $BackColor FontFace $ButtonFont TextSize $ButtonTextSize - Klicken Sie im Hauptbereich auf Eine Eigenschaft hinzufügen… und wählen Sie die erforderliche Eigenschaft aus.
- Anstatt einen statischen Wert einzugeben, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Token verknüpfen.
- Klicken Sie auf das $, das im Wertfeld erscheint, und wählen Sie das entsprechende Themen-Token aus.
Achten Sie beim Verknüpfen der Tokens des Themas auf $[Token] in ThemeA im Hover, um zu wissen, dass das Token aus dem Thema stammt und nicht aus dem globalen Token-Blatt (denken Sie daran, dass das Thema bereits die globalen Tokens ableitet).
Themen-Duplikation
Sobald Sie ein Thema allgemein festgelegt haben, können Sie es duplizieren und verschiedene Tokens ändern, um einen einzigartigen Themenstil zu definieren.
Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über das ThemeA-Thema, klicken Sie auf die Schaltfläche ⋮ und wählen Sie Duplizieren.
Benennen Sie das duplizierte Thema in ThemeB um.
Verknüpfen Sie zwei der Tokens des Themas mit zwei verschiedenen Stil-Tokens:
Themen-Token Stil-Token BackColor $Magenta ButtonTextSize $Text24 - Klicken Sie rechts neben dem Wertfeld der Eigenschaft auf die Schaltfläche ⋮ und wählen Sie Token trennen.
- Klicken Sie erneut auf ⋮ und wählen Sie Token verknüpfen.
- Klicken Sie im Wertfeld auf das $ und wählen Sie das neue zugehörige Stil-Token aus.
Themen-Austausch
Sobald Sie mehrere Themen haben, können Sie zwischen ihnen über den Themenordner oder über ein Skript, wie in SetDerives() beschrieben, wechseln.
Wählen Sie im linken Bereich des Stil-Editors den Allgemein-Ordner im Themes-Zweig aus.
Wechseln Sie im Hauptbereich zwischen den Themen mithilfe der Optionsfelder.
