Vous avez sans doute eu le besoin de visualiser un PDF sans avoir à l’ouvrir, via AppSheet. Dans cet article nous vous décrivons comment mettre en place une prévisualisation en 4 étapes. C’est parti !
Le résultat attendu
Nous allons rappeler les principes de bases, puis vous décrire les étapes à suivre pas à pas. Le résultat prendra la forme d’un tableau de bord interactif avec d’un côté la liste des fichiers, de l’autre l’aperçu de chaque fichier.
Le type File et les PDF
Le type “File” est celui qui permet de stocker tout type de fichier, y compris les PDF.
A ce titre, le typage d’une colonne avec “File” déclenche la mise à disposition d’un bouton d’action spécifique : “Open File”.
Il ne prend pas en compte la spécificité du PDF (Portable Document Format), qui est une sorte de format d’image.
Dans nos usages quotidiens, nous pouvons avec un explorateur de fichiers obtenir une prévisualisation des fichiers. Mais pour AppSheet, il n’y a pas de bouton “prévisualisation”.
L’astuce : le type XY
Le type XY est un type permettant de visualiser des coordonnées sur la base d’une image. C’est un couple de coordonnées compris entre 0 et 100.
Il peut s’utiliser pour indiquer par exemple, sur un plan d’usine, l’emplacement de plusieurs machines.
Le principe se déroule ainsi : on indique les coordonnées relatives sur l’image, et on indique de quelle image il s’agit.
En pratique : exploiter le type XY avec un PDF
Hypothèses initiales :
- nous avons une table FILE
- cette table porte une colonne[file] contenant un fichier PDF.
Etape 1 : ajouter une colonne de type XY
Nous ajoutons une colonne [xy], réelle ou virtuelle, à cette table FILE.
Etape 2 : paramétrer la colonne XY
En cliquant sur le crayon noir ou bleu attaché à cette colonne, on accède aux options et paramètres de cette colonne.
Il nous faut rechercher la section “Type Details”, et inscrire une simple expression dans le champ “Background image for the XY coordinates” (en français : Image de fond pour les coordonnées XY)
Etape 3 : monter une vue de type Map utilisant la colonne xy
On peut créer maintenant une vue basée sur cette colonne. Il s’agira d’une vue de type Map, pour laquelle on précise que les coordonnées sont la colonne [xy].
Cette colonne étant vide, aucun repère ne sera affiché. Cependant, c’est bien l’image du PDF qui sera utilisée pour le fonds de carte.
Etape 4 : monter un dashboard interactif
La magie opère ici : on montera un dashboard avec d’un côté la liste des fichiers par exemple avec le type Table, et de l’autre la vue de type Map qu’on vient de monter.
Il faut être vigilant à cocher l’option “Interactif” sur cette vue.
Une fois ceci fait, le résultat apparaît sur l’émulateur. Vous pouvez constater que ça fonctionne pour tous les fichiers PDF que vous avez entrés au préalable !
Nota : si votre fichier PDF fait plusieurs pages, seule la première sera utilisée pour la visualisation.
Vous pouvez aussi customiser un peu les permissions et affichages pour obtenir un rendu convivial pour l’utilisateur.
Limites de cette méthode
Cette méthode fonctionne très bien et présente deux limites, très mineures à mon sens.
Troncage partiel de l’aperçu
La prévisualisation rogne une partie du PDF, mais celui-ci s’affiche tout de même si l’utilisateur souhaite zoomer sur une partie tronquée.
Comme mentionné plus haut, cette prévisualisation porte uniquement sur la première page. Pour voir davantage, il conviendra d’ouvrir le document dans un nouvel onglet en utilisant le bouton d’action proposé nativement par AppSheet.
Délai d’affichage
Lors du premier affichage de la prévisualisation des PDF, un délai de 2 à 5 secondes survient. Cependant, une fois que c’est affiché cette image est stockée dans le cache du navigateur et son ré-affichage est immédiat.
Conclusion
Nous vous avons présenté ici une technique très pratique et rapide à mettre en place pour visualiser les PDF sans devoir ouvrir un nouvel onglet. En synthèse, on tire parti de la possibilité d’utiliser un PDF en fond de carte pour l’afficher via un dashboard interactif.
Qu’en pensez-vous ?
Si vous avez un projet ou une question, n’hésitez pas à nous contacter !