TextBox

<TextBox>-Controls werden verwendet, um mit Text, Zahlen oder Datumsangaben zu arbeiten. Je nach Typ der TextBox ändert sich ihr Aussehen und Verhalten.

Um die Action "Select" nach dem Abwählen eines TextBox-Controls aufzurufen, kann innerhalb des TextBox-Controls eine SelectAction eingefügt werden.

Für das Element <TextBox> lassen sich folgende Attribute festlegen:

Attribut	Beschreibung
`autocomplete`	Dieses HTML-Attribut legt fest, ob die Autovervollständigung für die TextBox ein- oder ausgeschaltet ist. In der Standardeinstellung ist die Autovervollständigung aktiviert. Mögliche Werte: `true` / `false`
`border`	Legt fest, ob um das Control ein Rahmen angezeigt wird. Funktioniert nur, wenn `multiline="true"`. Mögliche Werte: `true` / `false`
`border-left`	Legt fest, ob ein linker Rand angezeigt wird. Funktioniert nur, wenn `multiline="true"`. Mögliche Werte: `true` / `false`
`border-right`	Legt fest, ob ein rechter Rand angezeigt wird. Funktioniert nur, wenn `multiline="true"`. Mögliche Werte: `true` / `false`
`border-top`	Legt fest, ob ein oberer Rand angezeigt wird. Funktioniert nur, wenn `multiline="true"`. Mögliche Werte: `true` / `false`
`border-bottom`	Legt fest, ob ein unterer Rand angezeigt wird. Funktioniert nur, wenn `multiline="true"`. Mögliche Werte: `true` / `false`
`displayName`	Beschriftung der TextBox. Data Binding möglich Mögliche Werte: Beliebige Zeichenkette
`iconColor`	Definiert die Farbe des Icons. Data Binding (Color) möglich Mögliche Werte: Hexadezimaler Farbwert, z. B.`ff5a00`, oder Ausdruck für Data Binding (Color) Verwenden Sie keine Raute vor dem Farbwert oder eine verkürzte Schreibweise des Farbwerts! Farbcode aus der Farbpalette der Web App (vgl. Theming), z. B. `A200`
`iconPosition`	Position des Icons innerhalb der TextBox. Mögliche Werte: `prefix`: Icon wird zu Beginn der TextBox angezeigt (Standard). `suffix`: Icon wird am Ende der TextBox angezeigt.
`iconUrl`	Pfad zu einer Grafikdatei oder Angabe eines Material Icons, der als Icon verwendet wird. Data Binding möglich Die Grafikdatei muss im Ordner `Resources` direkt unterhalb des Web-App-Projekts enthalten sein. Pfadangabe relativ zum Ordner `Resources`. Das Material Icon muss mit dem Präfix `icon` angegeben werden, z. B. `icon:<MaterialIconName>`. Mögliche Werte: Zeichenkette (URI), z. B. `clock.png` `icon:<MaterialIconName>`, z. B. `icon:extension` Mit `Strg`+`Leertaste` erhalten Sie eine Übersicht der verfügbaren Icons. Die Auswahl kann von den tatsächlich verfügbaren Material Icons abweichen.
`multiline`	Legt fest, ob in der TextBox mehrzeilige Ein-/Ausgaben möglich sind. Funktioniert nur beim Typ `text`. Mögliche Werte: `true` / `false`
`rows`	Legt die sichtbare Höhe des Textfeldes fest. Funktioniert nur bei mehrzeiligen Textfeldern. Es können mehr Zeilen eingegeben werden, diese sind dann über Scrollen sichtbar. Mögliche Werte: Ganze Zahlen (Standard: `5`)
`type`	Typ der TextBox, ändert Verhalten und Aussehen. Mögliche Werte: `email`: E-Mail-Adresse `month`: Monat und Jahr mit Datepicker `number`: Zahl mit Wählpfeilen (Spinner) `search`: Suchfeld `tel`: Telefonnummer `text`: Text (Standard) `time`: Zeit mit Wählpfeilen (Spinner) `url`: URL `week`: Kalenderwoche und Jahr mit Datepicker und Wählpfeilen (Spinner) Alle Werte, die ein Datum oder eine Uhrzeit enthalten, müssen in UTC gespeichert und bereitgestellt werden!
`value`	Inhalt der TextBox. Übersetzbar Data Binding möglich Mögliche Werte: Beliebige Zeichenkette
`background`	Definiert eine Farbe für den Hintergrund des Controls. Data Binding (Color) möglich Diese Einstellung überschreibt die Standardfarbe des Farbschemas! Dieses Attribut funktioniert nicht für die Controls `Maps` und `HtmlDocument`! Mögliche Werte: Hexadezimaler Farbwert, z. B. `ff5a00`, oder Ausdruck für Data Binding (Color) Verwenden Sie keine Raute vor dem Farbwert! Verwenden Sie keine verkürzte Schreibweise des Farbwerts! Farbcode aus der Farbpalette der Web App (vgl. Theming), z. B. `A200`
`enabled`	Legt fest, ob der Nutzer mit dem Control interagieren kann. Data Binding (Boolean) möglich Mögliche Werte: `true`/`false` oder Ausdruck für Data Binding
`disabled`	Legt fest, ob der Nutzer mit dem Control interagieren kann. Data Binding (Boolean) möglich Mögliche Werte: `true`/`false` oder Ausdruck für Data Binding
`fontFamily`	Legt die Schriftfamilie fest. Data Binding (String) möglich Mit diesem Attribut wird die Standardschrift der Web App für dieses Control überschrieben. Wird das Attribut auf einem Element definiert, so wird die Schriftfamilie an die Kindelemente des Elementes vererbt, sofern die Kindelemente das Attribut `fontFamily` nicht explizit gesetzt haben. Dieses Attribut funktioniert nicht für die Elemente `Image`, `Map` und `HtmlDocument`. Mögliche Werte: `MainFont`: hinterlegte Hauptschrift Fontcode aus der Font-Palette, z. B. `Font04` Ausdruck für Data Binding (String)
`fontSize`	Legt die Schriftgröße fest. Data Binding (String) möglich Mit diesem Attribut wird die Standardschriftgröße der Web App für dieses Control überschrieben. Dieses Attribut funktioniert nicht für die Elemente `Image`, `Map` und `HtmlDocument`. Mögliche Werte: Beliebige ganze Zahl oder Dezimalzahl mit einem Punkt als Dezimaltrennzeichen, z. B. `20` ; `20.8` ; `.9` Schriftgröße in Pixel, z. B. `20px` Schriftgröße in Punkt, z. B. `18pt` Schriftgröße im Vergleich zur Schriftgröße des Elternelements, z. B. `.8em` oder `120%` Schlüsselwörter: `xx-Small`, `x-small`, `small`, `medium`, `large`, `x-large`, `xx-large`, `smaller` `larger` Ausdruck für Data Binding (String)
`fontStretch`	Legt die Breite der einzelnen Schriftzeichen fest. Data Binding (String) möglich Mit diesem Attribut wird die Standardbreite der Schriftzeichen für dieses Control überschrieben. Mögliche Werte: `Condensed` `Expanded` `ExtraCondensed` `ExtraExpanded` `Medium` `Normal` (Standard) `SemiCondensed` `SemiExpanded` `UltraCondensed` `UltraExpanded` Ausdruck für Data Binding (String) Dieses Attribut funktioniert nicht für die Elemente `Image`, `Map`, `Chart` und `HtmlDocument` .
`fontStyle`	Legt die Neigung der Schrift fest. Data Binding (String) möglich Mit diesem Attribut wird die Standardneigung der Schriftzeichen für dieses Control überschrieben. Mögliche Werte: `italic`: kursive Schrift `normal`: normale Schrift (Standard) `oblique`: schräg gestellter Schriftstil (berechnet) Ausdruck für Data Binding (String) Dieses Attribut funktioniert nicht für die Elemente `Image`, `Map` und `HtmlDocument`.
`fontWeight`	Legt die Schriftstärke fest. Data Binding (String) möglich Mit diesem Attribut wird die Standardstärke der Schriftzeichen für dieses Control überschrieben. Mögliche Werte: `Black` `Bold` `DemiBold` `ExtraBlack` `ExtraBold` `ExtraLight` `Heavy` `Light` `Medium` `Normal` (Standard) `Regular` `SemiBold` `Thin` `UltraBlack` `UltraBold` `UltraLight` Ausdruck für Data Binding (String) Dieses Attribut funktioniert nicht für die Elemente `Image`, `Map` und `HtmlDocument`.
`foreground`	Definiert eine Farbe für den Vordergrund (Texte usw.) des Controls. Data Binding (Color) möglich Diese Einstellung überschreibt die Standardfarbe des Farbschemas! Dieses Attribut funktioniert nicht für die Controls `Map` und `HtmlDocument`! Mögliche Werte: Hexadezimaler Farbwert, z. B. `ff5a00`, oder Ausdruck für Data Binding (Color) Verwenden Sie keine Raute vor dem Farbwert! Verwenden Sie keine verkürzte Schreibweise des Farbwerts! Farbcode aus der Farbpalette der Web App (vgl. Theming), z. B. `A200`
`horizontalAlign`	Richtung, in die die Elemente fließen. Reihenfolge der Elemente entspricht ihrer Deklaration. Mögliche Werte: `left` (Standard) `center` `right`
`textOverflow`	Gibt an, was passieren soll, wenn das Control voll ist. Mögliche Werte: `ellipsis`: Mit `...` zeigen, dass der Text nicht zu Ende ist (Standard) `hidden`: Text abbrechen, auf ganze Wörter achten `wordBreak`: innerhalb des Wortes abbrechen `allow`: Text zwischen den Wörtern umbrechen
`visible`	Legt fest, ob das Control sichtbar ist. Data Binding (Boolean) möglich Mögliche Werte: `true`/`false` oder Zeichenkette für Data Binding

Beispiel `<TextBox>`

Im folgenden Beispiel ist die Verwendung des <TextBox>-Tags gezeigt.

XML

<FlowLayout>
	<TextBox value="Example 1"/>
	<TextBox value="Example 2" multiline="true"/>
	<TextBox value="2018-04-12" type="date"/>
</FlowLayout>

Der obige Code führt zu folgenden TextBoxen:

Beispiel <TextBox>

Beispiel `<TextBox>`