Afficher des données dynamiques avec les galeries Power Apps

Créer des listes interactives et dynamiques dans vos applications devient simple avec les bons outils. Les Galeries Power Apps transforment vos bases de données en interfaces visuelles élégantes et fonctionnelles. Que vous gériez des contacts, des produits ou des tâches, ce composant vous permet d’afficher et de manipuler vos informations efficacement. Découvrez comment tirer parti de cet élément essentiel pour concevoir des applications professionnelles.

En bref

  • Les galeries existent en trois formats : verticale pour le défilement classique, horizontale pour une navigation latérale, et flexible pour s’adapter au contenu
  • La création commence par l’insertion du composant, la connexion à une source de données, puis la personnalisation du modèle qui se répète automatiquement
  • Les fonctions Filter, Search et Sort permettent de filtrer et organiser les données affichées, avec possibilité d’ajouter des barres de recherche interactives
  • La propriété Selected permet d’exploiter l’élément cliqué pour afficher des détails ou naviguer vers d’autres écrans
  • L’optimisation passe par la délégation des opérations à la source de données et la limitation du nombre de contrôles dans le modèle pour maintenir de bonnes performances

Qu’est-ce qu’une galerie Power Apps ?

Une galerie dans Power Apps représente un composant visuel qui permet de présenter plusieurs éléments de données sous forme de liste. Imaginez un carnet d’adresses ou une liste de produits : la galerie affiche ces informations de manière structurée et répétitive.

Ce contrôle s’appuie sur une source de données pour récupérer automatiquement les informations. Vous pouvez connecter une galerie à différentes sources comme SharePoint, Excel, Dataverse ou même des API externes.

Les Galeries Power Apps fonctionnent selon un principe de modèle. Vous créez la mise en page d’un seul élément, et Power Apps reproduit automatiquement cette disposition pour tous les autres enregistrements de votre source.

Les différents types de galeries disponibles

Power Apps propose trois formats principaux de galeries selon vos besoins d’affichage. Chaque type répond à un usage spécifique et offre une présentation adaptée.

Galerie verticale

La galerie verticale affiche les éléments les uns sous les autres avec un défilement vers le bas. Ce format convient parfaitement pour afficher des listes de contacts, de commandes ou de documents.

Nous conseillons ce type pour les applications mobiles où l’utilisateur fait défiler naturellement l’écran avec son pouce.

Galerie horizontale

Cette variante présente les éléments côte à côte avec un défilement latéral. Elle s’avère particulièrement utile pour des portfolios d’images ou des sélections de produits.

L’espace vertical reste ainsi disponible pour d’autres informations sur l’écran.

Galerie flexible

La galerie flexible ajuste automatiquement la hauteur de chaque élément selon son contenu. Ce type évite les espaces vides inutiles quand certains éléments contiennent plus de texte que d’autres.

Elle offre une présentation plus naturelle et optimise l’utilisation de l’espace disponible.

Comment créer votre première galerie

La création d’une galerie dans Power Apps se fait en quelques étapes simples. Commencez par ouvrir Power Apps Studio et créer une nouvelle application ou ouvrir une existante.

Dans l’onglet Insertion, sélectionnez le type de galerie souhaité. Une galerie vide apparaît sur votre écran avec un message vous invitant à sélectionner une source de données.

Cliquez sur le panneau des données à droite et choisissez votre source. Si elle n’apparaît pas, ajoutez une nouvelle connexion via le bouton correspondant.

  • Sélectionnez la galerie sur votre écran
  • Ouvrez la propriété Items dans la barre de formule
  • Tapez le nom de votre source de données
  • Personnalisez les champs affichés via le menu Édition
  • Ajustez la mise en page selon vos préférences

Personnaliser l’apparence de vos éléments

La personnalisation représente la force des Galeries Power Apps. Vous contrôlez chaque aspect visuel de vos éléments pour créer une interface unique et professionnelle.

Chaque galerie contient un premier élément appelé modèle. Toutes les modifications apportées à ce modèle se répercutent automatiquement sur les autres éléments de la liste.

Modifier les champs affichés

Sélectionnez votre galerie et cliquez sur l’icône de crayon pour entrer en mode édition. Vous pouvez alors ajouter, supprimer ou repositionner les champs de données affichés.

Pour changer un champ, cliquez sur l’étiquette concernée et modifiez sa propriété Text dans la barre de formule. Remplacez simplement le nom de colonne par celui qui vous intéresse.

Ajuster les couleurs et polices

Les propriétés Color, Fill et Font permettent de personnaliser l’apparence textuelle. Vous pouvez utiliser des couleurs fixes ou créer des formules conditionnelles pour varier l’affichage.

Par exemple, la formule If(ThisItem.Statut = « Urgent », Red, Black) affiche le texte en rouge pour les éléments urgents.

Filtrer et trier les données affichées

Une galerie puissante ne se contente pas d’afficher des données brutes. Elle permet de filtrer et organiser l’information pour une navigation optimale.

La propriété Items de votre galerie accepte des formules complexes combinant plusieurs fonctions. Les fonctions Filter, Search et Sort transforment vos données avant affichage.

Créer un filtre simple

Supposons que vous voulez afficher uniquement les éléments actifs d’une liste. Modifiez la propriété Items ainsi : Filter(VotreSource, Statut = « Actif »).

Vous pouvez combiner plusieurs conditions avec des opérateurs logiques comme And ou Or pour des filtres plus précis.

Ajouter une barre de recherche

Insérez un contrôle Input text au-dessus de votre galerie. Nommez-le par exemple RechercheTexte. Modifiez ensuite la propriété Items de votre galerie avec cette formule : Search(VotreSource, RechercheTexte.Text, « NomColonne »).

Les utilisateurs peuvent maintenant taper du texte pour filtrer instantanément les résultats affichés.

Interagir avec les éléments sélectionnés

Afficher des données reste une première étape. La vraie valeur apparaît quand les utilisateurs peuvent interagir avec ces informations.

Chaque galerie possède une propriété Selected qui référence l’élément actuellement sélectionné par l’utilisateur. Vous pouvez exploiter cette propriété pour afficher des détails ou déclencher des actions.

Afficher les détails d’un élément

Créez un formulaire ou des étiquettes à côté de votre galerie. Liez leurs propriétés aux données de l’élément sélectionné avec la syntaxe MaGalerie.Selected.NomChamp.

Quand l’utilisateur clique sur un élément de la liste, les détails correspondants s’affichent automatiquement dans la zone prévue.

Naviguer vers un écran de détails

Ajoutez une action OnSelect à votre galerie ou à un bouton dans le modèle. Utilisez la fonction Navigate pour rediriger vers un autre écran en transmettant les données sélectionnées.

Cette approche convient particulièrement pour les applications mobiles où l’espace d’écran reste limité.

Optimiser les performances de vos galeries

Les galeries chargent parfois des centaines ou milliers d’enregistrements. Sans optimisation, votre application peut devenir lente et frustrante pour les utilisateurs.

La délégation représente le concept clé pour maintenir de bonnes performances. Power Apps délègue le filtrage et le tri à la source de données plutôt que de tout charger en mémoire.

Vérifiez toujours l’avertissement de délégation dans Power Apps Studio. Un triangle bleu apparaît quand une formule ne peut pas être déléguée, limitant les résultats à 500 enregistrements par défaut.

Nous recommandons d’utiliser des fonctions déléguables comme Filter et Sort plutôt que des fonctions qui nécessitent le chargement complet comme AddColumns dans certains contextes.

Erreurs courantes et solutions

Même avec de l’expérience, certains problèmes reviennent fréquemment lors de l’utilisation des galeries. Voici les situations les plus rencontrées et leurs résolutions.

La galerie reste vide

Vérifiez d’abord que votre source de données contient réellement des enregistrements. Contrôlez ensuite les filtres appliqués qui pourraient exclure tous les résultats.

Testez en remplaçant temporairement la propriété Items par le nom simple de votre source sans formule.

Les données ne se rafraîchissent pas

Power Apps met en cache les données pour améliorer les performances. Utilisez la fonction Refresh(VotreSource) dans un bouton ou au démarrage de l’écran pour forcer une mise à jour.

Cette action s’avère particulièrement utile après une modification ou un ajout d’enregistrement.

Les performances sont dégradées

Limitez le nombre de contrôles dans votre modèle de galerie. Chaque étiquette, image ou bouton multiplie la charge de calcul pour tous les éléments affichés.

Réduisez également la hauteur visible de la galerie pour afficher moins d’éléments simultanément. Power Apps charge seulement les éléments visibles et quelques-uns au-dessus et en dessous.

FAQ

Quelle est la limite d’éléments affichables dans une galerie Power Apps ?

La limite d’éléments affichables dans une galerie Power Apps dépend de la délégation. Par défaut, 500 enregistrements maximum peuvent être récupérés si votre formule n’est pas déléguée. Avec une délégation correcte, la galerie peut afficher des milliers d’enregistrements car le traitement s’effectue côté source de données.

Peut-on imbriquer plusieurs galeries les unes dans les autres ?

Imbriquer plusieurs galeries est techniquement possible dans Power Apps. Vous pouvez placer une galerie à l’intérieur du modèle d’une autre galerie pour créer des structures de données hiérarchiques. Attention toutefois, cette pratique peut dégrader significativement les performances de votre application.

Comment afficher un message quand la galerie ne contient aucun résultat ?

Pour afficher un message quand la galerie ne contient aucun résultat, ajoutez une étiquette avec la propriété Visible définie sur CountRows(MaGalerie.AllItems) = 0. Placez votre message dans la propriété Text. L’étiquette apparaîtra uniquement lorsque la galerie sera vide après filtrage.

Est-il possible d’ajouter des boutons d’action dans chaque élément de galerie ?

Ajouter des boutons d’action dans chaque élément de galerie est tout à fait possible. Insérez simplement un contrôle bouton dans le modèle de votre galerie. Configurez sa propriété OnSelect pour utiliser ThisItem afin d’accéder aux données de l’élément spécifique et déclencher l’action souhaitée.

Comment gérer l’affichage d’images dans une galerie Power Apps ?

L’affichage d’images dans une galerie Power Apps se gère via un contrôle Image placé dans le modèle. Définissez sa propriété Image avec ThisItem.NomColonneImage pour afficher l’URL ou le chemin de l’image. Utilisez la propriété ImagePosition pour contrôler le recadrage et l’ajustement.