Bild (Steuerelementtyp) in Jitterbit App Builder

Ein Bild-Steuerelement zeigt ein Bild aus der einheitlichen Bildbibliothek von App Builder auf einem Panel in der UI-Schicht an. Diese Bibliothek enthält sowohl hochgeladene Fotos als auch integrierte Symbolesets von App Builder, sodass das gleiche Bild-Steuerelement ein von Benutzern hochgeladenes Foto, ein statisches Logo oder eines der integrierten Symbole anzeigen kann, je nachdem, welches Bild Sie wählen und wie Sie Bildzweck konfigurieren.

Hinzufügen eines Bild-Steuerelements

Um ein neues Bild-Steuerelement zu einem Panel hinzuzufügen, verwenden Sie den Dialog „Steuerelement hinzufügen" und wählen Sie Bild als Steuerelementtyp:

Konvertieren eines vorhandenen Steuerelements in ein Bild-Steuerelement

Um ein vorhandenes Steuerelement in den Typ Bild zu ändern:

1. Navigieren Sie zum Steuerelement, indem Sie entweder den Live Designer oder die App Workbench verwenden:

   • Öffnen Sie in der App-Vorschau die Seite mit dem Steuerelement und wählen Sie Aktionsschublade > Live Designer.

   • Öffnen Sie in der App Workbench die Registerkarte „Seiten", dann suchen Sie in der Seiten-Oberfläche die Seite mit dem Steuerelement und doppelklicken Sie entweder auf die Zeile oder klicken Sie auf das Symbol Datensatz öffnen. Suchen Sie in der Oberfläche Seitenpanel-Layout das Panel mit dem Steuerelement und klicken Sie auf Steuerelemente.

2. Falls Sie sich im Live Designer befinden, klicken Sie auf das Steuerelement in der Seitenansicht. Dadurch wird der Live Designer mit Bearbeitungsoptionen für dieses Steuerelement gefüllt. Falls Sie sich in der App Workbench befinden, suchen Sie in der Oberfläche Steuerelemente nach dem Steuerelement und doppelklicken Sie entweder auf die Zeile oder klicken Sie auf das Symbol Datensatz öffnen am Ende der Zeile. App Builder öffnet einen Dialog, der dem des Live Designer ähnelt.

3. Stellen Sie in der Registerkarte Steuerelement-Eigenschaften das Feld Steuerelementtyp auf Bild ein.

4. Verwenden Sie in der Registerkarte Bild das Feld Bild, um nach einem Bild zu suchen und es auszuwählen. Die Dropdownliste enthält sowohl hochgeladene Fotos als auch integrierte Symbolesets von App Builder. Siehe Symboltkategorien für die verfügbaren Symbolesets. Falls der Datensatz des ausgewählten Bildes ein verknüpftes dunkles Bild hat, rendert das Steuerelement automatisch diese dunkle Variante, wenn der dunkle Modus aktiv ist. Weitere Informationen finden Sie unter Sammlungsbilder und dunkler Modus.

5. Legen Sie Bildzweck auf Symbol oder Foto fest, um der Art des ausgewählten Bildes zu entsprechen. Diese Einstellung steuert nur, wie das Bild rendert, und filtert nicht, welche Bilder zum Auswählen verfügbar sind.

6. (Optional) Legen Sie Abzeichen-Quelle (Spalte) auf einen Spaltenwert fest, um ein numerisches Abzeichen auf dem Bild anzuzeigen. Details finden Sie unter Abzeichen mit Schaltflächen.

7. Klicken Sie auf Speichern.

Aktualisieren Sie die Anwendungsansicht, um das Update zu bestätigen.

Symboltategorien

Symbole sind nach Kategorien in Auswahlslisten organisiert, z. B. in der Symbol-Feld im Menüelement-Dialog oder im Feld Bild auf einem Schaltflächen- oder Bild-Steuerelement. Wenn Sie im Suchfeld der Dropdownliste eingeben, werden entsprechende Symbole in einer Liste angezeigt, die unter Kategorieüberschriften gruppiert ist, die verschiedene Symbolquellen darstellen.

Die folgenden Kategorien sind verfügbar:

Weitere Informationen zum Wechsel der derzeit verwendeten Symbolgrafik-Stile finden Sie unter Ändern Sie die Füllung eines Symbols von durchgehend zu regulär.

Laden Sie ein Foto hoch und ersetzen Sie es

Kombinieren Sie ein Image-Steuerelement mit einem File-Steuerelement, um Benutzern das Hochladen eines neuen Fotos zu ermöglichen, das das aktuell angezeigte Foto ersetzt. Legen Sie den Image Purpose des gekoppelten Image-Steuerelements auf Photo für diesen Anwendungsfall fest.

Deaktivieren Sie die dunkle Bildvariante

Wenn der Datensatz eines Bildes über ein verknüpftes Dark Image verfügt, wechselt ein Image-Steuerelement, das es anzeigt, zur dunklen Variante, wenn der Dunkle Modus aktiv ist. Für einen Sonderfall, in dem ein bestimmtes Steuerelement immer das exakt ausgewählte Bild darstellen muss, z. B. eine Liste, bei der die Miniaturansicht neben einer Option dem exakten Bild dieser Option entsprechen muss, fügen Sie eine Disable Dark Image-Parameterbindung hinzu, die auf true gesetzt ist:

1. Öffnen Sie den Live Designer auf einer Seite, die das Image-Steuerelement enthält.
2. Wählen Sie das Image-Steuerelement aus, um seine Eigenschaften zu öffnen.
3. Klicken Sie auf das Symbol neben Control Type, um das Dialogfeld Parameter Bindings zu öffnen.
4. Klicken Sie auf Create. Das Dialogfeld Parameter Binding wird geöffnet.

5. Konfigurieren Sie die Parameterbindung:

   • Parameter: Wählen Sie Disable Dark Image.
   • Type: Wählen Sie Static Value.
   • Value: Geben Sie true ein.

6. Klicken Sie auf Save. Die neue Bindung wird im Parameter Bindings-Raster mit aktiviertem Kontrollkästchen Active angezeigt.

App Builder 4.67 und früher

In App Builder 4.67 und früher werden integrierte Symbolgrafiken und hochgeladene Bilder separat gespeichert. Das folgende Verhalten unterscheidet sich daher von dem auf dieser Seite beschriebenen:

• Integrierte Symbolgrafiken werden mithilfe eines separaten Icon-Steuerelementtyps angezeigt. Um eine Symbolgrafik dynamisch anzuzeigen, übergeben Sie den CSS-Namen der Symbolgrafik (z. B. times-circle-o) an das Icon-Steuerelement.
• Das Feld Image auf Image-, Checkbox- und List-Steuerelementen listet nur hochgeladene Bilder auf, nicht die integrierten Symbolgrafik-Sets.

Weitere Informationen zu den in App Builder verfügbaren Symbolgrafik-Sets finden Sie unter Symbolgrafik-Kategorien.