Anzeigen von Bildern

Sie können Bilder in Ihren Formularen anzeigen:

• Lokale Bilddateien
• Online-Bilder
• Base64-codierte Bilder.

Tutorials

Dynamische Bilddatei

So rendern Sie ein Bild dynamisch:

1. Set the image file path as a variable in the FormFieldsCollection (Studio) and name it accordingly (for example, img).

2. Navigate to the Display tab of the HTML Element component (Form Designer).

3. In the Content field, add <img href={{data.img}} />.

   Sie können das vollständige HTML-Tag, das das Bild enthält, als Variable festlegen. In diesem Fall binden Sie die Daten nur mithilfe von {{data.img}} im Feld Inhalt .

4. Under the Content field, check Refresh On Change.

Base64-codiertes Bild

So laden Sie ein in das Base64-Format konvertiertes Bild hoch:

1. Speichern Sie die Base64-Zeichenfolge in einer Variablen. Beispiel: img .
2. In the Content field of the HTML Element component, enter the following snippet:

   <img href="data:image/png;base64,{{data.img}}"  />
   

   Hinweis:

   This method allows you to change the image dynamically.

Lokale Bilddatei

So laden Sie lokale Bilddateien in Ihre Formulare hoch:

1. Use the Content form component.
2. Click Insert Image. This prompts you to browse for the image file you want to use.

Lokale Bilddatei mit HTML-Element -Komponente

So zeigen Sie eine lokale Bilddatei mit der Komponente HTML-Element an:

1. Drag and drap a HTML Element component into your form.
2. In the Content field of the Display tab, enter <img href="/file://path-to-file" />, where path-to-file is the local path to the file you want to display.

Um beispielsweise die Bilddatei unter C:\Folder\image.jpganzuzeigen, geben Sie das folgende Snippet ein:

<img href="/file://c:\folder\image.jpg" />