admin- Posted on
Vous vous êtes parfois demandé s’il était possible d’utiliser des icônes en couleur, autres que celles disponibles pour identifier les vues. On vous explique ci-dessous comment passer d’une vue symbolisée par une icône en noir et blanc, à une représentation toute en couleurs !
Voici la transformation que vous pouvez obtenir :
C’est parti pour le mode opératoire !
Etape 1 : Tout le monde à (la même) table !
Eh oui, la base de tout sera une table ! Voici un exemple de ce à quoi ça peut ressembler :
Sur cette table, on indiquera:
- une colonne-clé : pour permettre à AppSheet d’identifier chaque élément de manière unique
- le nom de la vue tel qu’il sera affiché à l’utilisateur
- le nom interne de la vue, tel qu’il est nommé sur l’éditeur d’application
- une photo ou une image
Pour cette dernière partie, vous pouvez au choix fournir une image de votre choix, ou indiquer une url vers un site qui met à disposition gratuitement une banque d’images ou de logo.
Un site que j’affectionne particulièrement est https://www.svgrepo.com/.
Etape 2 : Une colonne virtuelle de type “App”
Il faut maintenant créer la colonne virtuelle qui permettra à AppSheet de proposer à l’utilisateur une action de type “DeepLink”. Cela revient à créer en quelque sorte un lien URL vers une vue précise, de la même manière que l’appli le fait seule habituellement.
La formule de cette colonne , que nous appelons ici “Link”, porte cette syntaxe:
"#view="&[InternalViewName]Etape 3 : Créer une action DeepLink
Normalement cette étape est générée automatiquement par AppSheet (parce que c’est bien fait, il faut le dire…😉). Si ce n’est pas le cas, rendez-vous dans le panneau latéral “Behavior” (Comportement), et créer l’action suivante :
Etape 4 : Créer la vue principale
Plusieurs possibilités ici, qui dépendent de votre goût esthétique et surtout…du nombre de vues que vous souhaitez présenter à l’utilisateur.
Dans l’exemple présenté ici, c’est la vue “Gallery” qui est retenue, et celle-ci est basée sur votre table. Cependant, la vue Card s’y prête très bien également.
Ensuite, prêtez attention à définir l’action par défaut associée aux évènements de cette vue, que vous trouverez dans la section “Behavior” (Comportement).
Et le tour est joué !
Conclusion
C’est terminé ! Vous pouvez aller voir le résultat directement dans l’appli démo, réalisée pour votre plus grand plaisir, sur ce lien !
En résumé, il est très simple de créer une présentation conviviale des différentes vues d’une appli : une table qui porte la liste des vues, une colonne virtuelle, une vue basée sur tout cela, et tout de suite l’appli prend une allure un peu plus colorée et agréable à l’œil.
On peut même aller plus loin : on peut conditionner l’affichage des différents boutons en fonction du profil de l’utilisateur. Mais…ce sera l’objet d’un autre article ! 😉
Vous avez un projet pour une appli ou une formation AppSheet ? C’est ici que ça se passe !
