Im Design-Generator stellen Nutzer mit einem Number-Input-Feld eine Zahl im Design ein. Dafür ziehen sie an einem Schieberegler.
Was du damit steuerst
Ein Number-Input-Feld verbindest du mit einer Eigenschaft, die eine Zahl hat, zum Beispiel:
- Deckkraft (Opacity) und Drehung (Rotation)
- Position und Größe (X, Y, W, H)
- die Max Font Size eines Texts
- Abstände
Du verbindest es über Select Custom Property: Mit dem Werkzeug Create Input Field klickst du auf das Element, und im Popup links auf Select Custom Property.
Dann klickst du im Properties-Panel auf die Zahl, und ein Popup Create Field öffnet sich. Darin wählst du Number. Die einzelnen Schritte stehen in Checkbox-Input-Feld erstellen: Element ein- und ausblenden lassen. Dort klickst du statt auf Visibility auf die Zahl und wählst statt Checkbox Number.
Einstellungen
Die Einstellungen öffnest du im Input Fields View mit dem Zahnrad rechts im Input-Feld. Drei Einstellungen legen fest, welche Zahlen Nutzer wählen können:
- Min value: die kleinste Zahl. Hier beginnt der Schieberegler.
- Max value: die größte Zahl. Hier endet der Schieberegler.
- Increment: um wie viel sich die Zahl pro Schritt ändert. Bei 5 springt der Schieberegler zum Beispiel von 0 auf 5, 10, 15.
Beim Erstellen bekommt das Input-Feld einen Bereich, der zur Eigenschaft passt, zum Beispiel −360 bis 360 für Rotation und 0 bis 100 für Opacity. Gibt es für eine Eigenschaft keinen eigenen Bereich, gilt 0 bis 100 in Schritten von 1. Oft lohnt sich ein engerer Bereich, damit Nutzer zum Beispiel ein Logo nicht unsichtbar klein machen können.
Jedes Input-Feld hat außerdem die Einstellungen Title, Description und Variable name. Sie sind in Einstellungen eines Input-Felds erklärt.
Was Nutzer sehen
Im Design-Generator steht oben die Überschrift des Input-Felds. Neue Number-Input-Felder heißen Select Value. Besser verstehen Nutzer eine Überschrift, die sagt, worum es geht, zum Beispiel „Logo-Größe“.
Darunter steht immer ein Schieberegler. Nutzer ziehen ihn nach links oder rechts, und das Design ändert sich mit. Die Zahl selbst sehen sie nicht, nur ihre Wirkung im Design. Zu Beginn steht der Schieberegler auf dem Standardwert: dem Wert, den die Eigenschaft beim Verbinden hatte.