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. Définissez le chemin du fichier image en tant que variable dans CollectionChamps (Studio) et nommez-le en conséquence (par exemple, img).
2. Accédez à l'onglet Affichage du composant Élément HTML (Concepteur de formulaires).
3. Dans le champ Contenu , ajoutez <img href={{data.img}} />.

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

4. Dans le champ Contenu (Content), cochez Actualiser en cas de modification ( 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. Dans le champ Contenu du composant Élément HTML , saisissez l'extrait de code suivant :

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

   Remarque : cette méthode vous permet de modifier l'image de manière dynamique.

Fichier image local

Pour charger des fichiers image locaux dans vos formulaires :

1. Utilisez le composant Formulaire de contenu (Content form).
2. Cliquez sur Insérer une image. Cela vous invite à rechercher le fichier image que vous souhaitez utiliser.

Fichier image local utilisant le composantHTML Element

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

1. Faites glisser et drapez un composant Élément HTML dans votre formulaire.
2. Dans le champ Contenu de l'onglet Affichage , entrez <img href="/file://path-to-file" />, où path-to-file est le chemin d'accès local au fichier que vous souhaitez afficher.

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" />