Contrôle de zone de liste modifiable dans Power Apps

Contrôle qui permet aux utilisateurs d’effectuer des sélections parmi les options fournies. Prend en charge la recherche et la sélection multiple.

Descriptif

Un contrôle de zone de liste modifiable vous permet de rechercher les éléments que vous sélectionnez. La recherche est effectuée côté serveur sur la propriété SearchField afin que les performances ne soient pas affectées par les sources de données volumineuses.

Le mode sélection unique ou multi-sélection est configuré via la propriété SelectMultiple.

Lorsque vous recherchez des éléments à sélectionner, pour chaque élément, vous pouvez choisir d’afficher une valeur de données unique, deux valeurs ou une image et deux valeurs (Person) en modifiant les paramètres de disposition dans le volet Données.

Lorsque vous affichez le contrôle sur de petits écrans, le menu volant de liste d’éléments devient un contrôle plein écran pour une meilleure facilité d’utilisation.

Limites

Le contrôle de zone de liste modifiable présente les limitations suivantes :

• Lorsque vous utilisez un contrôle de zone de liste modifiable à l’intérieur d’une galerie, ses sélections ne sont pas conservées lorsque l’utilisateur fait défiler la galerie. Ce n’est pas un problème si vous utilisez un contrôle zone de liste modifiable à l’intérieur d’une galerie qui ne fait pas défiler. Une solution de contournement n’est actuellement pas disponible.

Sélecteur de personnes

Pour utiliser la zone de liste déroulante en tant que sélecteur de personnes, choisissez le modèle de personne dans les paramètres de disposition dans le volet Données et configurez les propriétés de données associées à afficher pour la personne ci-dessous.

Propriétés principales

Éléments : source de données à partir de laquelle les sélections peuvent être effectuées.

DefaultSelectedItems : élément(s) sélectionné(s) initial(s) avant que l’utilisateur interagit avec le contrôle.

SelectedItems : liste des éléments sélectionnés résultant de l’interaction utilisateur.

Sélectionné : dernier élément sélectionné résultant de l’interaction utilisateur.

SelectMultiple : indique si l’utilisateur peut sélectionner un ou plusieurs éléments.

IsSearchable : indique si l’utilisateur peut rechercher des éléments avant d’effectuer une sélection.

SearchFields : champs de données de la source de données recherchée lorsque l’utilisateur entre du texte.

Propriétés supplémentaires

AccessibleLabel : étiquette pour les lecteurs d’écran.

BorderColor : couleur de la bordure d’un contrôle.

BorderStyle : indique si la bordure d’un contrôle est Solid, Dashed, Dotted ou None.

BorderThickness : épaisseur de la bordure d’un contrôle.

DisplayFields : liste des champs affichés pour chaque élément retourné par la recherche. Le plus simple à configurer via le volet Données sous l’onglet Options Propriétés.

DisplayMode : indique si le contrôle autorise l’entrée utilisateur (Modifier), affiche uniquement les données (Affichage) ou est désactivé (Désactivé).

FocusBorderColor : couleur de la bordure d’un contrôle lorsque le contrôle est concentré.

FocusBorderThickness : épaisseur de la bordure d’un contrôle lorsque le contrôle est concentré.

Hauteur : distance entre les bords supérieurs et inférieurs d’un contrôle.

InputTextPlaceholder : texte d’instruction affiché aux utilisateurs finaux lorsqu’aucun élément n’est sélectionné.

OnChange : actions à effectuer lorsque l’utilisateur modifie une sélection.

OnNavigate : actions à effectuer lorsque l’utilisateur sélectionne un élément.

OnSelect : actions à effectuer lorsque l’utilisateur appuie ou sélectionne un contrôle.

TabIndex : ordre de navigation clavier par rapport à d’autres contrôles.

Visible : indique si un contrôle apparaît ou est masqué.

Largeur : distance entre les bords gauche et droit d’un contrôle.

X : distance entre le bord gauche d’un contrôle et le bord gauche de son conteneur parent (ou de l’écran à défaut de conteneur parent).

Y : distance entre le bord supérieur d’un contrôle et le bord supérieur du conteneur parent (ou de l’écran à défaut de conteneur parent).

Examples

Zone de liste déroulante de base

Les étapes décrites dans cet exemple s’appliquent à n’importe quelle source de données qui fournit des tables, mais pour suivre ces étapes exactement, utilisez un environnement avec une base de données Microsoft Dataverse ayant des exemples de données.

1. Sélectionnez Insérer une>zone de liste modifiabled’entrée>, puis nommez-la « Combobox1 ».

2. Dans le volet Propriétés à droite de l’écran, ouvrez la liste Sélectionner une source de données (en regard des éléments), puis ajoutez ou sélectionnez une source de données telle que la table Comptes.

3. Dans le même volet, sélectionnez Modifier (en regard des champs).

4. Dans le volet Données , ouvrez la liste de texte principale , puis sélectionnez la colonne Nom principal qui s’affiche dans le contrôle Zone de liste modifiable .

5. Lorsque vous maintenez la touche Alt enfoncée, sélectionnez la flèche vers le bas pour ouvrir le contrôle zone de liste modifiable .

   Le contrôle affiche les données du nom principal que vous avez spécifié dans la source de données que vous avez spécifiée.

(Facultatif) Afficher le premier enregistrement par défaut

1. Définissez la propriété DefaultSelectedItems sur cette expression, en remplaçant DataSource par le nom de votre source de données :

   First(DataSource)
   

(Facultatif) Afficher la valeur nom du compte sélectionné dans une étiquette

1. Sélectionnez Insérer une>étiquette de texte, puis sélectionnez Étiquette.

2. Définissez la propriété Text sur cette expression, en remplaçant Text par la formule suivante :

   If(CountRows(ComboBox1.SelectedItems)>0, Concat(ComboBox1.SelectedItems,'Account Name',", "), "NO SELECTED ITEM")
   

   Note

   L’instruction If vérifie comment les éléments sélectionnés peuvent exister et les afficher dans une étiquette délimitée par des virgules ou un message « NO SELECTED ITEM » lorsqu’ils sont vides.

Simuler un comportement déroulant simple

En définissant IsSearchable sur false et SelectMultiple sur false, vous pouvez obtenir la même fonctionnalité d’une liste déroulante.

1. Sélectionnez Insérer une>entrée, puis sélectionnez Zone de liste déroulante.

2. Dans le volet Propriétés à droite de l’écran, ouvrez la liste Sélectionner une source de données (en regard des éléments), puis ajoutez ou sélectionnez une source de données.

3. Dans le même volet, sélectionnez Modifier (en regard des champs).

4. Dans le volet Données , ouvrez la liste de texte principale , puis sélectionnez la colonne à afficher dans le contrôle Zone de liste modifiable.

5. Définissez la propriété IsSearchable sur false.

6. Définissez la propriété SelectMultiple sur false.

7. Lorsque vous maintenez la touche Alt enfoncée, sélectionnez la flèche vers le bas pour ouvrir le contrôle zone de liste modifiable .

   Le contrôle affiche les données de la colonne que vous avez spécifiée dans la source de données que vous avez spécifiée.

   Note

   Le texte « Rechercher des éléments » a disparu et vous ne pourrez sélectionner qu’un seul élément.

Conseils sur l’accessibilité

Contraste des couleurs

Il doit y avoir un contraste de couleur adéquat entre :

• ChevronFill et ChevronBackground
• ChevronHoverFill et ChevronHoverBackground
• SelectionColor et SelectionFill
• SelectionFill et Fill
• SelectionTagColor et SelectionTagFill

Cela s’ajoute aux exigences de contraste de couleur standard.

Prise en charge du lecteur d’écran

• AccessibleLabel doit être présent.

  Note

  Sur les écrans tactiles, les utilisateurs du lecteur d’écran peuvent parcourir le contenu de la zone de liste modifiable de manière séquentielle. La zone de liste modifiable agit comme un bouton qui affiche ou masque son contenu lorsqu’il est sélectionné.

Prise en charge du clavier

• TabIndex doit être égal à zéro ou supérieur afin que les utilisateurs du clavier puissent y accéder.

• Les indicateurs de focus doivent être clairement visibles. Utilisez FocusBorderColor et FocusBorderThickness pour y parvenir.

  Note

  La touche d’onglet navigue vers ou loin de la zone de liste déroulante. Les touches de direction naviguent dans le contenu de la zone de liste déroulante. La clé d’échappement ferme la liste déroulante lors de l’ouverture.