Expression-Syntax

Im Expression-Editor und in den Eigenschaften im Properties-Panel schreibst du Expressions als Code. Hier steht, wie du Werte, Namen, Rechenzeichen und Funktionen schreibst. Wie du den Expression-Editor öffnest, steht in Expression-Editor verwenden.

Werte

• Zahlen: 20 oder 3.5, mit Punkt statt Komma.
• Wahr oder falsch: true oder false.
• Text: in Backticks, zum Beispiel `Hello`. Anführungszeichen wie "Hello" gehen auch. Werte einfügen kannst du aber nur in Backticks (siehe unten).
• Farben: als Hex-Code in Backticks, zum Beispiel `#0050ff`.

Backticks sind schräge Hochkommas: `. Auf einer deutschen Tastatur tippst du sie mit Shift und der Taste rechts neben ß, danach die Leertaste.

Mehr dazu steht in Feste Werte in Expressions.

Namen

• Variable: Den Wert eines Input-Felds nutzt du über seinen Variablennamen, zum Beispiel price.
• Wert eines Elements: Schreib den Namen des Elements, wie er im Layers-Panel steht, einen Punkt und den Wert, zum Beispiel headline.bottom. Welche Werte es gibt, steht in Werte von Elementen in Expressions.

Variablen und Elemente brauchen verschiedene Namen, damit klar ist, was gemeint ist.

Rechnen und vergleichen

• Rechnen mit + (plus), - (minus), * (mal) und / (geteilt durch). price * 1.19 rechnet zum Beispiel den Preis mal 1,19.
• Vergleichen mit == (gleich), != (ungleich), > (größer als), < (kleiner als), >= (größer oder gleich) und <= (kleiner oder gleich). Ein Vergleich ergibt true oder false, zum Beispiel price > 100.

Funktionen

Funktionen schreibst du in Großbuchstaben, ihre Werte in Klammern und durch Kommas getrennt: FLOOR(price), ADD(headline.width, 40) oder IF(isMember, `Member`, `Guest`).

Für ganze Zahlen nutzt du CEIL (aufrunden), FLOOR (abrunden) oder TRUNC (Nachkommastellen abschneiden).

Alle Funktionen stehen in der Übersicht der Expression-Funktionen.

Werte im Text

• Im Expression-Editor schreibst du den Text in Backticks und jeden Wert in ${...}: `Total: ${price} EUR`.
• In einer Texteigenschaft im Properties-Panel, etwa Content, tippst du nur Total: ${price} EUR. Die Backticks ergänzt Bluepic selbst.

Eine Zahleneigenschaft wie Y berechnet headline.bottom + 20 direkt. Tippst du dasselbe in eine Texteigenschaft, bleibt es Text und wird nicht berechnet. Auch in einer Farbeigenschaft wie Fill Color zählt alles, was du tippst, als Text. Expressions für Farben schreibst du deshalb im Expression-Editor.

Ist eine Eingabe im Properties-Panel fehlerhaft, zeigt die Eigenschaft eine rote Meldung und übernimmt sie nicht. Klickst du danach woanders hin, zeigt die Eigenschaft wieder den letzten gültigen Wert.