Der integrierte Stil-Editor ist ein umfassendes Werkzeug, 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 der Editor geöffnet ist, klicken Sie auf die Schaltfläche Design erstellen, um ein Basistilset zu generieren.
Die Erstellung eines Designstilsets über den Stil-Editor generiert ein BaseStyleSheet innerhalb eines Design-Ordners in ReplicatedStorage. Dieses Basiblatt synchronisiert spezifische standortbedingte Vorgaben wie die Color3 Vorgabe von [163, 162, 165] mit Vorgaben, die aus Einfügungsabläufen im Studio stammen. Es wird dringend empfohlen, dass Sie das Basistilblatt nicht löschen oder versuchen, es zu ändern — bauen Sie stattdessen Tokens und Stilregeln um ein Designblatt, um Ihre UI-Ziele zu erreichen.
Darüber hinaus wird ein StyleSheet-Blatt im Design-Ordner generiert, das eine StyleDerive zum Basisstilblatt enthält. Wenn Sie entscheiden, diese StyleDerive zu entfernen, können die nicht gestylten Werte für GuiObjects unerwartete Werte annehmen, z. B. eine standardmäßige Size von 0, 0, 0, 0.
Stil-Tokens
Stil Tokens, die durch Attribute eines Token-StyleSheet definiert sind, stellen UI-Eigenschaftsvariablen dar, die in Stilen und Komponenten verwendet werden können; zum Beispiel könnte es eine gemeinsame Farbe für einen Frame.BackgroundColor3, TextLabel.TextColor3 und UIStroke.Color geben. Tokens sind vergleichbar mit CSS-Variablen.
Obwohl nicht erforderlich für das UI-Styling, werden Tokens dringend für erweiterbares UI-Design und Stilaktualisierungen über die Zeit empfohlen. Sie sollten damit beginnen, die folgenden Tokens zu erstellen, um zu verstehen, wie sie mit anderen Aspekten des universellen Stylings zusammenhängen.
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 Tokenblatt aus und erstellen Sie mehrere Tokens, indem Sie im Hauptpanel auf Token hinzufügen… klicken. Diese Tokens werden im gesamten 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 
Design-Blätter
Ein Designstilblatt fasst Stilregeln zusammen 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 vorinstalliertes Designblatt namens 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 Basisstilblatt für die Verwendung in Ihren benutzerdefinierten Stilkonfigurationen ableiten (vererben).
Sobald Sie ein Designblatt haben, können Sie einen Test- Bildschirmcontainer einrichten, um ihn mit dem Stil-Editor zu verwenden, oder einen In-Erfahrung-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 wurde, 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 Stylink einfügen im oberen rechten Bereich des Hauptpanels des Editors.
Stilregeln
Stil regeln gelten für jede Instanz, die der Selector-Definition der Regel entspricht, um Merkmale wie Klassenname, Instanz-Tag und Hierarchiebeziehungen zuzuordnen. Auf einer hohen Ebene funktioniert die Instanzübereinstimmung und -änderung über die Selector-Definition durch:
- Roblox Klassen-Selektoren, die alle Instanzen einer bestimmten UI-Klasse anvisieren, z. B. Frame, ImageLabel, TextButton usw.
- Instanznamensauswahl 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 Regel richtet alle Frames mit einer einheitlichen Hintergrundfarbe und Größe ein.
Wählen Sie im linken Bereich des Stil-Editors Frame im UI Elemente-Zweig aus.
Verknüpfen Sie zwei zuvor erstellte Stil-Tokens mit zwei Frame-Eigenschaften:
Eigenschaft Stil-Token BackgroundColor3 $Magenta Size $SquareL - Klicken Sie im Hauptpanel auf Eigenschaft hinzufügen… und wählen Sie die erforderliche Eigenschaft aus. Beachten Sie, dass Sie Keywords eingeben können, um in dem Dropdown-Menü schneller Eigenschaften zu finden.
- Anstelle eines statischen Werts 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 verknüpfte Token aus.
Fügen Sie eine neue Frame in das ScreenGui ein, die Sie zuvor erstellt und verknüpft haben. Die von Ihnen definierten Stile sollten automatisch darauf angewendet werden.
Tagregel
Instanz Tag-Selektoren zielen auf bestimmte UI-Objekte ab, die über CollectionService mit Tags versehen sind. Die folgende Regel ist darauf ausgelegt, einen TextButton, der als ButtonPrimary gekennzeichnet ist, mit einer benutzerdefinierten Hintergrundfarbe, Schriftart und Textgröße zu gestalten.
Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über das StyleSheet-Blatt, klicken Sie auf die ⋮-Schaltfläche und navigieren Sie über zu Neu ⟩ Tag.
Benennen Sie die neue Tagregel 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 Hauptpanel auf Eigenschaft hinzufügen… und wählen Sie die erforderliche Eigenschaft aus. Denken Sie daran, dass Sie Keywords eingeben können, um in dem Dropdown-Menü schneller Eigenschaften zu finden.
- Anstelle eines statischen Werts 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 verknüpfte 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-Tagregel im linken Bereich des Stil-Editors aus, und klicken Sie auf Tag anwenden im Hauptpanel. 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 gestalten. Die folgende Regel gestaltet ein TextLabel mit einer benutzerdefinierten Textgröße und abgerundeten Ecken.
Wählen Sie im linken Bereich des Stil-Editors TextLabel im UI Elemente-Zweig aus.
Verknüpfen Sie ein zuvor erstelltes Stil-Token mit der TextSize-Eigenschaft:
- Klicken Sie im Hauptpanel auf Eigenschaft hinzufügen… und wählen Sie die TextSize-Eigenschaft aus. Denken Sie daran, dass Sie Keywords eingeben können, um in dem Dropdown-Menü schneller Eigenschaften zu finden.
- Anstelle eines statischen Werts 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-Objekt ist erforderlich, um abgerundete Ecken für andere Elemente zu konfigurieren und anzuwenden. Um eines zu erstellen:
Bewegen Sie im linken Bereich den Mauszeiger über TextLabel, klicken Sie auf die ⋮-Schaltfläche und navigieren Sie über zu Neu ⟩ Pseudo-Instanz ⟩ UICorner.
Eine neue UICorner-Pseudo-Instanz erscheint im linken Bereich unter dem TextLabel-Element.
Wählen Sie die neue UICorner-Instanz im linken Bereich aus und verknüpfen Sie ein zuvor erstelltes Stil-Token mit der CornerRadius-Eigenschaft:
- Klicken Sie im Hauptpanel auf Eigenschaft hinzufügen… und wählen Sie die CornerRadius-Eigenschaft.
- Anstelle eines statischen Werts 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 darauf angewendet werden.
Statusregel
GuiObject Status-Selektoren entsprechen einem der vier GuiState-Enum-Werte wie Hover und ermöglichen Ihnen die automatische Konfiguration von Stiländerungen für interaktive Zustände. Die folgende Regel erstellt einen Hover-Zustand von -4 Grad Drehung für alle ImageButtons.
Wählen Sie im linken Bereich des Stil-Editors ImageButton im UI Elemente-Zweig aus.
Klicken Sie auf die ⋮-Schaltfläche und navigieren Sie über zu Neu ⟩ GuiState ⟩ Hover.
Eine neue Hover-Zustandsmodifikatorinstanz erscheint im linken Bereich unter dem ImageButton-Element.
Wählen Sie den neuen Hover-Modifikator im linken Bereich aus, klicken Sie auf Eigenschaft hinzufügen… im Hauptpanel und wählen Sie Rotation aus. Denken Sie daran, dass Sie Keywords eingeben können, um in dem Dropdown-Menü schneller Eigenschaften zu finden.
Geben Sie im Wertfeld der Eigenschaft -4 ein.
Fügen Sie ein neues ImageButton in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben. Wenn Sie über die Schaltfläche im Ansichtsfeld 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 einheitlichen Satz zu erstellen.
Eingebaute Abfragen
Einige StyleQuery-Bedingungen sind sehr verbreitet, 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 Small, Medium und Large-Viewportgrößen zu bearbeiten.
Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über TextLabel, klicken Sie auf die ⋮-Schaltfläche und navigieren Sie über zu Neu ⟩ StyleQuery ⟩ Builtin ⟩ ViewportDisplaySize.
Dadurch wird ein Queries-Ordner unter der TextLabel-Regel erstellt, der drei Abfrageregeln enthält:
- @ViewportDisplaySizeLarge — Definieren Sie Eigenschaften, die gelten, wenn der Viewport Large ist.
- @ViewportDisplaySizeMedium — Definieren Sie Eigenschaften, die gelten, wenn der Viewport Medium ist.
- @ViewportDisplaySizeSmall — Definieren Sie Eigenschaften, die gelten, wenn der Viewport Small ist.
Klicken Sie unter jeder Abfrageregel auf Eigenschaft hinzufügen… und legen Sie den spezifischen Text-String fest, 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 unterschiedlichen Geräten reagiert:
Ändern Sie das Gerät im Geräteemulator, um zu sehen, wie sich der Text in Echtzeit ändert.
Benutzerdefinierte Abfrage
Sie können einer vorhandenen Regel eine Stilabfrage hinzufügen, um ein responsives UI zu erstellen, das sich an seinen Container anpasst. Die folgende Konfiguration sorgt dafür, dass sich ein TextLabel automatisch nur dann ändert, wenn es auf eine Breite von 400 Pixeln oder mehr erweitert wird.
Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über TextLabel, klicken Sie auf die ⋮-Schaltfläche und navigieren Sie über zu Neu ⟩ StyleQuery ⟩ Benutzerdefiniert.
Diese Aktion erstellt einen Queries-Ordner unter der TextLabel-Regel, der zwei verlinkte Elemente enthält:
- ::StyleQuery-Pseudo-Instanzregel, in der Sie die Bedingungen definieren.
- @StyleQuery-Regel, in der Sie die Eigenschaften angeben, die angewendet werden sollen, wenn diese Bedingungen erfüllt sind.
Wählen Sie die übergeordnete TextLabel-Regel im Hauptpanel aus und definieren Sie die folgenden Standard-Eigenschaften:
Eigenschaft Wert BackgroundColor3 $Magenta Text Standardtext Wählen Sie die ::StyleQuery-Regel im Hauptpanel aus, klicken Sie auf 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 Hauptpanel 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 Ansichtsfeld in der Größe ändern.
Passen Sie seine Breite an, um zu sehen, wie der Stil in Echtzeit gewechselt wird.
Während die Breite des TextLabel kleiner ist, wird die MinSize-Bedingung nicht erfüllt und das Etikett verwendet seine standardmäßige Hintergrundfarbe und den Text.
Während das manuelle Ändern mindestens eine schnelle Möglichkeit ist, die responsiv 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 spezifische Bildschirmauflösungen und ViewportDisplaySize-Bedingungen reagiert.
- Verwenden Sie den Controller-Emulator, um die Logik von PreferredInput zu überprüfen, z. B. den Stilwechsel, wenn ein Gamepad erkannt wird.
Stilübergänge
Stil Übergänge, vergleichbar mit CSS-Übergängen, lassen Sie die Werte von Eigenschaften über eine festgelegte Dauer 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, für eine bestimmte Eigenschaft wird ein anderer Übergang ausdrücklich festgelegt.
Wählen Sie TextButton im UI Elemente-Zweig aus und fügen Sie im Hauptpanel 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 über zu Einfügen ⟩ Übergang.
Ein Standardübergang von 1, Quad, Out, 0 wird direkt unter der TextButton-Regel eingefügt, was einen Übergang von 1 Sekunde, Anpassungsstil Quad, Anpassungsrichtung Out und keine Verzögerung anzeigt.
Bewegen Sie den Mauszeiger über die übergeordnete TextButton-Zeile, klicken Sie auf die ⋮-Schaltfläche und navigieren Sie über zu Neu ⟩ GuiState ⟩ Hover.
Fügen Sie für den neuen Hover-Modifikator zwei neue Eigenschaften als die Ziele für den Hover-Zustand hinzu.
Eigenschaft Wert BackgroundColor3 #33AAFF Rotation -5 
Fügen Sie ein neues TextButton in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben. Wenn Sie über die Schaltfläche im Ansichtsfenster fahren, sollte sie allmählich aufhellen und sich um 5 Grad gegen den Uhrzeigersinn drehen.
Token-verbundene
Um Übergangsverhalten über mehrere Regeln hinweg wiederzuverwenden, können Sie Tokens definieren, die den TweenInfo-Datentyp darstellen. Die folgende Regelkonfiguration erstellt einen Hover-Zustand, um alle TextButtons von -5 Grad Drehung und einer helleren Hintergrundfarbe zu überführen.
Wenn Sie dies nicht bereits getan haben, erstellen Sie ein Token-Stilblatt mit dem Namen TokenSheet.
Wählen Sie das neue Tokenblatt aus und erstellen Sie zwei neue Tokens, indem Sie im Hauptpanel 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 Elemente-Zweig aus und fügen Sie im Hauptpanel drei neue Eigenschaften mit den folgenden Werten hinzu:
Eigenschaft Wert AutoButtonColor false BackgroundColor3 #335FFF Rotation 0 Für jede neue Eigenschaft ausser AutoButtonColor, bewegen Sie den Mauszeiger über deren 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 über zu Neu ⟩ GuiState ⟩ Hover.
Fügen Sie für den neuen Hover-Modifikator zwei neue Eigenschaften als die Ziele für den Hover-Zustand hinzu.
Eigenschaft Wert BackgroundColor3 #33AAFF Rotation -5 Fügen Sie ein neues TextButton in das ScreenGui ein, das Sie zuvor erstellt und verknüpft haben. Wenn Sie über die Schaltfläche im Ansichtsfeld fahren, sollte sie allmählich aufhellen und sich um 5 Grad gegen den Uhrzeigersinn drehen.
Stil-Themen
Stil Themen bestehen aus Sets spezifischer Tokens, die ausgetauscht werden können, beispielsweise Farb-Tokens, die ein "helles" und "dunkles" Thema definieren.
Themenerstellung
Zur Erweiterbarkeit werden Themen in Ordnern organisiert. Während ein einzelner Ordner für die meisten Zwecke ausreichen kann, können Sie gerne Themen in Ordner wie "Farben" oder "Schriften" organisieren, wenn gewünscht.
Erstellen Sie einen neuen Themenordner:
- Bewegen Sie im linken Bereich des Stil-Editors den Mauszeiger über Themen, klicken Sie auf das ⊕ und wählen Sie Neues Thema.
- Benennen Sie das neue Ordner-Element in Allgemein um.
Erstellen Sie ein neues Themen-Stilblatt:
- 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 Eigenschaften von UI-Objekten verknüpfen, wie z. B. BackgroundColor3 eines TextButton. Themenblätter müssen ein gemeinsames Set von Tokens verwenden, um korrekt zu funktionieren.
Mit ThemeA im linken Bereich des Stil-Editors ausgewählt:
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 Hauptpanel 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 Elemente-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 Hauptpanel auf Eigenschaft hinzufügen… und wählen Sie die erforderliche Eigenschaft aus.
- Klicken Sie anstelle eines statischen Wertes 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 Tokenblatt (denken Sie daran, dass das Thema bereits von den globalen Tokens abstammt).
Themen-Duplikation
Sobald Sie ein Thema allgemein festgelegt haben, können Sie es duplizieren und verschiedene Tokens ändern, um einen einzigartigen Stil 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 verknüpfte Stil-Token aus.
Themenwechsel
Sobald Sie mehrere Themen haben, können Sie diese über den Themenordner oder über ein Skript wie in SetDerives() beschrieben umschalten.
Wählen Sie im linken Bereich des Stil-Editors den Allgemein-Ordner im Themen-Zweig aus.
wechseln Sie im Hauptpanel zwischen den Themen mithilfe der Optionsschaltflächen.
