Affichage des images

Vous pouvez afficher des images dans vos formulaires :

• Fichiers image locaux
• Images en ligne
• Images encodées en Base64.

Didacticiels

Fichier image dynamique

Pour rendre une image dynamiquement :

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}} />.

   Vous pouvez définir la balise HTML complète contenant l'image comme variable. Dans ce cas, liez les données en utilisant uniquement {{data.img}} dans le champ Contenu .

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

Image encodée en Base64

Pour télécharger une image convertie au format Base64 :

1. Stockez la chaîne Base64 dans une variable. Par exemple, img .
2. In the Content field of the HTML Element component, enter the following snippet:

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

   Remarque :

   This method allows you to change the image dynamically.

Fichier image local

Pour charger des fichiers image locaux dans vos formulaires :

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

Fichier image local utilisant un composant d'élément HTML

Pour afficher un fichier image local à l'aide du composant Élément HTML :

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.

Par exemple, pour afficher le fichier image situé dans C:\Folder\image.jpg, saisissez l'extrait de code suivant :

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