Table of Contents

Button

Ein Button ist eine Möglichkeit, über die der Benutzer mit der mobilen Applikation interagieren kann und wird in der oberen oder unteren Leiste eines Schritts angezeigt. Er besteht aus einem Aktivator, einer Darstellung und einer zugehörigen Ansicht.

Es gibt mehrere Wege, Buttons zu einer Leiste hinzuzufügen. Man kann einen Button per Drag & Drop aus dem Menüband in die Leiste ziehen, über den Kontextmenü-Eintrag Neuer Button oder über die Eigenschaft Anzahl der Elemente im Inspektor. Ändert man diesen Wert, werden automatisch neue Buttons angelegt bzw. bestehende Buttons gelöscht um die korrekte Anzahl widerzuspiegeln.

Buttons

Eigenschaften

Eigenschaft Typ Erklärung
Aktivator Dropdown / ausgeblendet Auswahl eines Aktivators, der bei Berührung ausgelöst wird. Wird ausgeblendet, falls es bereits ein Übergang von diesem Button zu einem Schritt gibt.
Darstellung Dropdown Auswahl einer Darstellung zur Beschreibung der Button-Oberfläche.
Zugehörige Ansicht Dropdown Auswahl einer Ansicht des aktuellen Schritts, auf die sich der Button bezieht.
Bedingung für die Deaktivierung Code Code, der zurückgibt, ob der Button aktiviert (true) oder deaktiviert (false) sein soll.

Aktivator

Der Aktivator des Buttons beschreibt, welche Aktion die App ausführen soll, wenn der Benutzer auf den Button tippt. Es gibt viele verschiedene Arten von Aktivatoren. Es kann z.B. eine Nachricht angezeigt, auf einen Schritt navigiert oder ein Datensatz gelöscht werden. Weitere Informationen zu Aktivatoren finden Sie hier.

Tipp

Aktivatoren, die Code oder eine fest definierte Funktion ausführen, müssen über das Feld Aktivator im Inspektor hinterlegt werden. Aktivatoren, die auf einen Schritt navigieren werden per Drag & Drop am Konnektor des Buttons erzeugt.

Darstellung

Die Benutzeroberfläche des Buttons wird durch seine Darstellung beschrieben. Sie muss, ebenso wie ein Aktivator, über ein Dropdown-Feld ausgewählt werden.

Eine Darstellung besteht aus einem Bild oder einem Text, von denen eines von beiden auf dem Button angezeigt wird. Zusätzlich enthält die Darstellung eine horizontale Ausrichtung des Buttons innerhalb seiner Leiste. Mögliche Werte sind linksbündig, rechtsbündung oder zentriert. Weitere Informationen zu Darstellungen finden Sie hier.

Zugehörige Ansicht

Für manche Funktionen benötigt ein Button keine weiteren Informationen. Soll dem Benutzer z.B. lediglich ein Hinweis angezeigt werden, muss der Button nur einen Aktivator und eine Darstellung definieren. Oft ist es aber auch nötig, die Funktion des Buttons in einem gewissen Kontext auszuführen, etwa um den aktuell angezeigten Datensatz zu löschen oder eine Listenansicht zu sortieren.

Diesen Kontext bildet die Ansicht, auf die sich der Aktivator beziehen soll. Wenn ein neuer Datensatz in einer Liste angelegt werden soll, dann benötigt der Button einen Verweis auf diese Liste. Hierfür gibt es das Feld Zugehörige Ansicht im Inspektor von dem aus man eine der Ansichten desselben Schritts auswählen kann. In der Auswahlliste erscheinen nur Ansichten, die eine Bindung auf eine Klasse haben.

Deaktivierung des Buttons

Es ist möglich, den Button nur unter bestimmten Umständen zu aktivieren und in allen anderen zu deaktivieren. Wenn der Button deaktiviert ist, bleibt er zwar sichtbar, er ist jedoch ausgegraut und der Benutzer kann ihn nicht anklicken. Die Deaktivierung eines Buttons ist sinnvoll, wenn z.B. das Löschen eines Datensatzes für bestimmte Nutzergruppen verhindert werden soll.

Um zu definieren, wann der Button deaktiviert werden soll, muss ein Skript hinterlegt werden, das Zugriff auf die Variable model hat. Somit kann z.B. der Status des aktuell angezeigten Datensatzes validiert werden. Der Code wird jedes mal durchlaufen, wenn der Button angezeigt wird (analog zu callOnFocus für Schritte).

Tipp

Der Code muss true oder false zurückgeben, wobei der Button bei true aktiviert und bei false deaktiviert wird.

Das Deaktivieren des Buttons abhängig vom Synchronisierungsstatus ist beispielsweise folgendermaßen möglich:

return Ti.App.modelGenerator.isMobileGenerated(model);

Siehe auch

Schritte
Navigations- und Symbolleiste
Darstellungen