Variablen erstellen und verwalten

Bevor du anfängst

Wer diese Funktion nutzen kann

Jede Person in jedem Abo

Jede Person mit Schreibzugriff auf eine Datei kann Variablen erstellen und bearbeiten.

Noch nicht viel Erfahrung mit Variablen? Unseren Leitfaden zu Variablen ansehen →

Auf die Ansicht „Variables“ (Variablen) zugreifen

Über die Ansicht Variables (Variablen) kannst du Variablen, Modi, Gruppen und Sammlungen erstellen und verwalten.

1. Hebe alle Auswahlen auf der Arbeitsfläche auf, indem du Esc drückst oder auf die Arbeitsfläche klickst.
2. In der rechten Seitenleiste findest du den Abschnitt Local variables (Lokale Variablen).
3. Klicke auf Open variables (Variablen öffnen).

Eine Variable erstellen

1. Klicke in einer beliebigen Sammlung auf + Create variable (+ Variable erstellen).
2. Wähle aus dem Drop-down-Menü einen variable type (Variablentyp) aus.
3. Gib der Variable in der ersten Spalte einen Namen und einen Wert in der zweiten.

Wähle eine oder mehr Variablen aus und drücke auf ⇧ Shift (⇧ Umschalt) Enter, um eine Variable zu duplizieren.

Um eine Variable zu löschen, klicke mit der rechten Maustaste auf die Variable und wähle Delete variable (Variable löschen) aus.

Einen Alias erstellen

Erstelle einen Alias für eine Variable, um seinen Wert mit einer vorhandenen Variable zu verknüpfen. So kannst du Design-Tokens implementieren und die Verwaltung von Aktualisierungen deiner Designs effizienter gestalten.

Beispiel: Du hast mehrere Farbvariablen, die auf dieselbe Farbvariable verweisen. Wenn diese Farbe aktualisiert werden muss, musst du nur die Quelle aktualisieren, anstatt jede Instanz der Farbe manuell zu aktualisieren.

Eine Variable kann auf andere Variablen desselben Typs verweisen.

So erstellst du einen Alias für eine Variable:

1. Klicke in der Ansicht Variables (Variablen) mit der rechten Maustaste auf den Wert einer Variablen und wähle Create alias (Alias erstellen) aus.
2. Wähle im Tab Libraries (Bibliotheken) eine Variable aus, um einen Alias festzulegen. Du kannst über die Suchleiste eine Variable nach Namen suchen oder die aktivierten Bibliotheken durchsuchen.

Um einen Alias zu lösen, bewege den Mauszeiger über das Wertfeld und klicke auf Detach alias (Alias lösen).

Eine Variable bearbeiten

Bewege den Mauszeiger über die Zeile einer Variablen und klicke auf das Symbol Edit variable (Variable bearbeiten), um die Bearbeitungsansicht zu öffnen.

Hier kannst du folgende Aktionen ausführen:

1. Den Namen der Variable ändern
2. Eine Beschreibung hinzufügen, um die Verwendung einer Variable zu erläutern
3. Den Wert einer Variable ändern
4. Mithilfe der Kontrollkästchen wählen, auf welche Eigenschaften die Variable angewendet werden kann ↓
5. Codesyntax ↓ hinzufügen
6. Variable aus der Veröffentlichung ausblenden →

Eine Variable in bestimmten Eigenschaften anzeigen

Variablen können standardmäßig auf alle unterstützten Designeigenschaften angewendet werden.

Du kannst Zahlenvariablen einschränken, indem du die Eigenschaften, auf die sie angewendet werden können, begrenzt.

Schalte in der Ansicht Edit variable (Variable bearbeiten) die Designeigenschaften, in denen die Variable verfügbar sein soll, ein oder aus.

Codesyntax (bald verfügbar)

Die Codesyntax ermöglicht es dir, Variablen im Code mit gültigen Variablennamen darzustellen. Du kannst verschiedene Namen pro Plattform erstellen, einschließlich CSS, JS, Kotlin und Swift.

Eine Codesyntax der Variable wird in Codeschnipseln in Dev Mode angezeigt, wenn Elemente mit der Variable untersucht werden.

Eine Auswahl von Variablen gruppieren

So organisierst du Variablen in einer Gruppe:

1. Wähle mehrere Variablen in der Ansicht Variables (Variablen) aus:
   • Halte die ⌘ Befehlstaste/Strg gedrückt, um mehrere Variablen auszuwählen.
   • Halte die⇧ Umschalttaste gedrückt, um einen Variablenbereich auszuwählen.
2. Klicke mit der rechten Maustaste auf die Auswahl und wähle New group with selection (Neue Gruppe mit Auswahl) aus.

Du kannst Gruppen neu anordnen, indem du sie in der Seitenleiste der Variablen-Ansicht anklickst und ziehst. So kannst du auch Gruppen in andere Gruppen ziehen, um sie einzubetten.

Eine Gruppe umbenennen

1. Klicke in der Ansicht Variables (Variablen) auf Toggle sidebar (Seitenleiste umschalten), damit sie angezeigt wird.
2. Doppelklicke auf den Gruppennamen.
3. Gib einen neuen Namen für die Variablengruppe ein.

Eine Gruppe verwalten

1. Klicke in der Ansicht Variables (Variablen) auf Toggle sidebar (Seitenleiste umschalten), damit sie angezeigt wird.
2. Klicke mit der rechten Maustaste auf den Gruppennamen in der Seitenleiste.
3. Wähle im Menü eine der folgenden Optionen ein:
   • Ungroup (Gruppierung aufheben)
   • Duplicate group (Gruppe duplizieren)
   • Delete group (Gruppe löschen)

Variablensammlungen erstellen und verwalten

So erstellst du eine Variablensammlung:

1. Klicke in der Ansicht Variables (Variablen) auf Toggle sidebar (Seitenleiste umschalten), damit sie angezeigt wird.
2. Öffne das Drop-down-Menü und wähle Create collection (Sammlung erstellen) aus.

So benennst du eine Variablensammlung um oder löschst sie:

1. Klicke in der Ansicht Variables (Variablen) auf Toggle sidebar (Seitenleiste umschalten), damit sie angezeigt wird.
2. Öffne das Drop-down-Menü „Collections“ (Sammlungen) und wähle die Sammlung aus, die du verwalten möchtest.
3. Öffne das Drop-down-Menü „Collections“ (Sammlungen) erneut und wähle Rename collection (Sammlung umbenennen) oder Delete collection (Sammlung löschen) aus.