Spinner contrôle

Un contrôle utilisé pour créer une expérience de chargement.

Note

La documentation complète et le code source sont accessibles dans le Référentiel de composants de code GitHub.

Description

Un contrôle Spinner est le contour d’un cercle qui s’anime autour de lui-même, indiquant à l’utilisateur que les choses sont en cours de traitement. Il apparaît lorsque le processus n’est pas sûr de la durée d’une tâche, ce qui en fait la version indéterminée d’un contrôle ProgressIndicator.

Les spinners peuvent varier en taille et peuvent être situés en ligne avec le contenu ou centrés. Les spinners apparaissent généralement après le traitement ou la validation d’une action. Ils sont subtils et ne prennent généralement pas beaucoup de place, mais sont des transitions par rapport à la tâche terminée.

Ce composant de code fournit un wrapper autour du contrôle Spinner de Fluent UI à utiliser dans les applications canevas et les pages personnalisées. Consultez la documentation des composants pour connaître les bonnes pratiques.

Propriétés principales

Property	Description
Label	Etiquette optionnelle pour le spinner.
SpinnerSize	La taille du spinner à afficher. Choix : xSmall, Small, Medium, Large
SpinnerAlignment	L’alignement du spinner dans les limites du contrôle. Choix : Left, Center, Right
LabelPosition	Placement facultatif de l’étiquette du spinner à une position particulière. Choix : Bottom, Top, Left, Right

Propriétés du style

Property	Description
Theme	Accepte une chaîne JSON générée à l’aide du Concepteur de thème Fluent UI (windows.net). Si vous laissez ce champ vide, le thème par défaut défini par Power Apps sera utilisé. Consultez Création de thèmes pour obtenir des instructions de configuration.
AccessibilityLabel	Étiquette aria pour les lecteurs d’écran

Exemple

Afficher le spinner lors du chargement

Rendez le contrôle Spinner visible lorsqu’un processus commence, puis masquez-le lorsque le processus est terminé.

Utilisez une variable pour contrôler la visibilité du contrôle Spinner et mettre à jour les valeurs avant et après le bloc de code du processus.

UpdateContext({ var_showLoader: true });

/* Some code ... */

UpdateContext({ var_showLoader: false });

Ensuite, fournissez la variable var_showLoader comme valeur de la propriété IsLoading du spinner.

Limitations

Ce composant de code ne peut être utilisé que dans les applications canevas et les pages personnalisées.