Über Stilthemen im Jitterbit App Builder

Designs verfügen über eine Vorschau-Funktion, mit der Sie schnell eine visuelle Darstellung der genauen Darstellung verschiedener Bildschirme und Bedienfelder erhalten. App Builder mit dem ausgewählten Design aussehen wird. Diese Anleitung beschreibt die aktuelle Implementierung von Designs.

Übersicht

App Builder ermöglicht die Anpassung der visuellen Darstellung einer App in der Anwendungsebene durch die Nutzung von Style Themes. In App Builder, Designs sind definierte Paarungen von Komponenten und Werttypen, mit denen Sie das Erscheinungsbild definierter Bereiche der Anwendungsschicht-UI und-UX steuern können. Eine Komponente stellt hier einen Bereich in der Anwendungsschicht-UI dar, dessen Eigenschaften geändert werden können, z. B. ist Seite eine Komponente. Werttypen stellen die spezifischen Eigenschaften dar, die geändert oder definiert werden können, z. B. ist Hintergrundfarbe ein Werttyp.

Beispiel: Legen Sie die Hintergrundfarbe fest [Value type] der Links [Interface] lila sein.

Mehrere vordefinierte Basisthemen werden mitgeliefert App Builder das Sie ganz einfach so von Ihrer Anwendung verwenden oder als Basisdesign verwenden können, das Sie weiter anpassen können. Außerdem sind die folgenden Optionen über Designs verfügbar:

• Designeinstellungstypen sind verfügbar, um Ausrichtung, Abstand und CSS-Übergänge zu konfigurieren
• Die folgenden neuen Bereiche von Seiten von App Builder können über Designs angepasst werden:
  • Diagramm-, Karten- und Kalender-Immobilienbereiche
  • Kachelränder auf Tafeln/Spuren, Kachelzentrierung in einem Panel
  • Mehrzeilige Panel-Steuerelementsätze, Überschriften und Zellen (ermöglicht größere MRP-Zeilen)
  • Validierungen (Fehler, Warnungen, Eingabeaufforderungen und Ausnahmen, die dem Benutzer angezeigt werden)
  • Zurück-Schaltfläche
  • Schaltfläche „Weitere Zeilen laden“
• Möglichkeit, die Symbolleiste auszublenden, wenn alle intrinsischen Steuerelemente ausgeblendet sind, einschließlich der Deaktivierung der Zählung
• Die Schaltfläche „Schließen“ ('x') ist jetzt Teil des Panels und kann ähnlich gestaltet werden
• Unterstützt Panelsichtbarkeit, die das Panel ausblendet, aber den Platz reserviert (Wert „3“)
• Panelüberschriften können jetzt ausgeblendet oder ihre Größe über Formate angepasst werden
• Schriftarten auf Site-Ebene können remote geladen werden

Themenloser Staat

Ohne definierte und angewendete Themeninformationen, App Builder auf der Anwendungsebene erscheint es in einem themenlosen Zustand mit minimaler Stilisierung. Mithilfe von Designs kann ein Designer das allgemeine Erscheinungsbild einer App schnell verbessern.

Schnittstellen

Das Erstellen eines brandneuen Designs und dessen Zuweisung zu einer Anwendung führt zu keinen sichtbaren Änderungen, da das neue Design keine Implementierungen hat. Die auf Designebene ausgewählten Farben gelten nicht automatisch für Teile der Benutzeroberfläche der Anwendungsebene. Um benutzerdefinierte Farben über die Anwendungsebene anzuzeigen, müssen Sie die Komponenteneinstellungen konfigurieren. In Abb. 2 ist die Hintergrundfarbe der Komponente „Seite - Titelleiste“ für den Bereich Links auf Lila eingestellt.

Komponenten sind Teile der Benutzeroberfläche, die Stilimplementierungen erhalten können.

Werttypen

Wenn eine Komponente angegeben ist, können Sie einen Werttyp auswählen, um eine Eigenschaft anzuwenden. Werttypen können sich auf Schriftfarben, Hintergrundfarben, Bilder, Ausrichtung, Farbverlaufsinformationen, Größeninformationen usw. beziehen, je nachdem, welchen spezifischen Immobilienbereich Sie zur Anpassung ausgewählt haben. Auf der Themenseite verfügt jeder Werttyp über entsprechende Hilfetextinformationen, die hilfreiche Tipps und Anweisungen dazu enthalten, welche spezifischen Informationen Sie bereitstellen müssen.

Referenzieren von Farben durch reservierte Syntax

Beim Festlegen von Farben im Bereich „Designs“ von App Builder, (Rahmenfarbe, Hintergrundfarbe usw.) können Sie auf den Namen einer der drei auf Designebene definierten Farben verweisen. Dies ermöglicht eine schnellere Anpassung bei Verwendung der Kopierfunktion.

Die reservierten Syntaxbegriffe, die Sie angeben können, sind:

• {PrimaryColor}
• {SecondaryColor}
• {ComplementaryColor}

Anpassen von Farben

Bei Verwendung reservierter Namen können die Farben auch in Bezug auf Helligkeit oder Dunkelheit und Deckkraft angepasst werden.

Die Farben können in Bezug auf Helligkeit oder Dunkelheit und Deckkraft angepasst werden. Diese Anpassung ist für die folgenden reservierten Begriffe verfügbar:

• {PrimaryColor}
• {SecondaryColor}
• {ComplementaryColor}

Um die Helligkeit und Dunkelheit der Farbe anzupassen, fügen Sie ein Pipe-Zeichen zusammen mit einem numerischen Dezimalwert hinzu (positiver Wert zum Erhöhen oder negativer Wert zum Abdunkeln der Farbe). Erwartete Werte sind -.9- .9.

Syntax: {PrimaryColor|.25} oder {PrimaryColor|-.25}

Um die Farbopazität anzupassen, fügen Sie das Tilde-Zeichen zusammen mit einem numerischen Dezimalwert hinzu. Erwartete Werte sind .1- .9.

Syntax: {PrimaryColor~.25}

Schaltfläche „Kopieren“

Jedes Design kann kopiert werden. Verwenden Sie diese Funktion, wenn Sie schnell mit einem Design loslegen möchten und legen Sie einfach die drei Farben für Primär, Sekundär und Komplementär fest. Es stehen viele vordefinierte Designs zur Verfügung, die ausgewählt und unverändert verwendet oder weiter angepasst werden können, um schnell loszulegen.

App Builder Vordefinierte Themen

App Builder wird mit mehreren vordefinierten Designs geliefert. Obwohl diese technisch bearbeitet werden können, gehen beim Upgrade alle Änderungen verloren.

Vorschläge

Wenn Sie eine dunkle Hintergrundfarbe angeben, achten Sie darauf, dass Sie eine Schriftfarbe verwenden, die für den gesamten Text lesbar ist. Nutzen Sie die in der Schriftfarbe enthaltene Textschatteneigenschaft, um zusätzlichen Kontrast hinzuzufügen.

Anhang

Komponenten

Werttypen