App Designer | Items hinzufügen und individuell bearbeiten

Sie können jedes einzelne Item Ihrer App individuell gestalten und auch nachträglich (über den App Admin) im App Designer konfigurieren. So sind Sie in der Lage Ihre App beispielsweise farblich an Ihre Corporate Identity anzupassen, Zellen neu zu ordnen oder zusätzliche Restriktionen bei bestimmten Zellen zu hinterlegen.

Der App Designer bietet Ihnen dabei je nach Item unterschiedliche Optionen an.

Hier können Sie über die Vorschau ('Preview you app') jedes einzelne Item Ihrer App bearbeiten und so beispielsweise die Hintergrundfarbe einer Input Zelle ändern, oder ein Diagramm zu Ihrer App hinzufügen ('Add chart').

Themen in diesem Artikel

• Übersicht App Designer
• Items bearbeiten und hinzufügen
• Item-Editor - Reiter 'Main'
• Reiter 'Style' - Farben ändern
• Reiter 'Advanced' - erweiterte Optionen

Übersicht App Designer

Nachdem Sie die Excel Datei für Ihre App hochgeladen (Schritt 'Data') und das passende Template (Schritt 'Template') gewählt haben, wird die App im 'App Designer' gestaltet. In diesem Schritt können Sie neben optischen Aspekten, je nach App-Typ auch neue Zellen oder ein Diagramm zu Ihrer App hinzufügen.

phone_iphone

Preview App - Appvorschau - Hier sehen Sie einen Entwurf Ihrer App und können jedes einzelne Item über die Vorschau bearbeiten oder löschen. (Siehe Abschnitt: Items bearbeiten und hinzufügen)

sort

Rearrange Elements - Hier werden Items Ihrer App angeordnet oder Zellen gruppiert. Auch eine neue Seite mit weiteren Items kann hier hinzugefügt werden. (Siehe Artikel: Rearrange Elements | Zellen und Items anordnen)

add

Add Cell - Zellen aus der Excel Datei hinzufügen. Sollte sich zum Beispiel die Struktur der Quelldatei verändert haben, können Sie die neu hinzugekommenen Zellen hier zu Ihrer App hinzufügen. (Siehe Artikel: Add Cell | Zellen nachträglich zur App hinzufügen.)

insert_chart

Add Chart - Hier erstellen Sie mit wenigen Klicks interaktive Diagramme basierend auf Ihren Kalkulationen. Damit steigern Sie die Produktivität Ihrer App enorm. (Siehe Artikel: Add Chart | Diagramm zur App hinzufügen)

list

Add List - So können Sie eine "Unterliste" zu Ihrer Kalkulation hinzufügen.

palette

Change Theme - Wählen Sie eines der vordefinierten Themes für Ihre App. (Achtung: bisher gemachte Änderungen wie z.B. Farben werden überschrieben.)

print

Add print functionality - Mit dieser Funktion haben Sie die Möglichkeit Angebote direkt aus Ihrer App heraus zu versenden. Wir empfehlen folgendes Tutorial: Lizenzrechner mit Angebotsversand-Funktion erstellen.

build

Advanced Definitions - Dieser Bereich ist für erfahrene User mit IT-Kenntnissen die über den XML Konfigurator Ihre App optimieren wollen. (Siehe Artikel: Advanced definitions | Erweiterte Einstellungen)

Items bearbeiten und hinzufügen

Die jeweiligen Items (wie z.B. jede einzelne Zelle Ihrer App) werden über den Editor in der 'Preview your App'-Ansicht bearbeitet. phone_iphone

1. Gehen Sie zum App Dashboard.
2. Öffnen Sie die App, die Sie bearbeiten möchten.
3. Navigieren Sie zum Reiter 'Design' in der oberen Menüleiste.
4. Im Tab 'Preview your app' können Sie die Vorschau Ihrer App mit den einzelnen Items sehen.
5. Fahren Sie mit dem Maus-Cursor auf das Item, das Sie bearbeiten möchten.
6. Klicken Sie auf das Stift-Symbol, um den Editor für dieses Item zu öffnen. edit

Allgemeine Erklärung des Editors - Reiter 'Main'

Der Editor ist in 3 Bereiche eingeteilt: Main, Style und Advanced.

Je nachdem, welches Item Sie bearbeiten werden Ihnen in den einzelnen Tabs unterschiedliche Optionen angezeigt.

Input-Zelle bearbeiten

In diesem Beispiel wurde der Editor für eine Input-Zelle geöffnet. Dementsprechend finden Sie hier Einstellungen, die teilweise speziell für diesen Zellen-Typ relevant sind.

Folgende Änderungen können im Hauptbereich ('Main') vorgenommen werden:

Caption, Content type, Input Type, Metric Text, Minimal (Value), Step Size, Maximal (Value), Show edit buttons (-/+) on or off.

1. Caption: Beschriftung der Zelle. Erscheint in der oberen, linken Ecke.
2. Content type: Hier können Sie den Inhaltstyp der Zelle definieren. Zur Auswahl stehen Ihnen: Integer, Percent, Double, Grouplayout, Chart, List, Spacer, Image, String, Map, Header, Toggle, Currency.
3. Input type: Input, Output, Action Button.
4. Metric Text: Hier können Sie einen zusätzlichen Hinweis einfügen, der in der oberen, rechten Ecke der Zelle erscheint. Bspw. 'Mio.' um zu verdeutlichen, dass der Wert in Mio angegeben wird.
5. Minimal: Minimaler Wert der für diese Zelle eingegeben werden kann.
6. Step Size: Damit definieren Sie um wie viele Einheiten der Wert erhöht/reduziert wird, bei Benutzung der -/+ Buttons
7. Maximal: Maximaler Wert der für diese Zelle eingegeben werden kann.
8. Show edit buttons (-/+) an oder aus: Sie können die -/+ Buttons in der Zelle entfernen. Die Änderung des Wertes in Ihrer veröffentlichten App kann dann über die Eingabemaske (öffnet bei Klick auf den Wert) oder die   "Wisch-Funktion" verändert werden.

Reiter 'Style' - Farben ändern

Im Schritt 'Style' verändern Sie die Optik des ausgewählten Items.

Für die Input-Zelle haben Sie die Möglichkeit die Hintergrundfarbe, Zellenhöhe, Elementfarbe, Inhalttextfarbe, sowie die Farbe der Caption frei zu bestimmen.

1. Background Color: Damit verändern Sie die Hintergrundfarbe der Zelle. (hex Werte = #xxx).
2. Button Height: Damit verändern Sie die Höhe der Zelle. Der Wert wird als %-Wert des Displays eingegeben.
3. Element Color: Damit verändern Sie die Farbe der -/+ Buttons (hex Werte = #xxx).
4. Value Text Color: Damit verändern Sie die Farbe des Wertes innerhalb dieser Zelle (hex Werte = #xxx).
5. Caption Text Color: Damit verändern Sie die Farbe der Caption (hex Werte = #xxx).

Sie können die Farbauswahl statt über die Eingabe eines hex Wertes, auch über die Farbpalette vornehmen. Klicken Sie hierfür auf das jeweilige Viereck (4) und generieren die gewünschte Farbe.

Reiter 'Advanced' - erweiterte Einstellungen

Erfahrene User können weitere Änderungen über die Raw Definitions vornehmen.

Sie finden alle Definitionen in der Open as App Dokumentation unter openasapp.readme.io.

Weitere Optionen

Über die Icons im linken Bereich des App Designers erreichen Sie die einzelnen Design Items, die Sie zu Ihrer App hinzufügen können.