Groupe de boutons

Le composant Groupe de Boutons vous permet de combiner plusieurs boutons en une unité cohérente. Il organise et présente des actions liées de manière visuellement attrayante et conviviale.

Configuration Votre Groupe de Boutons

Étape 1 : Saisir les informations des boutons :

  • Commencez par ajouter les boutons qui composeront votre groupe. Pour chaque bouton, vous pouvez personnaliser :

    • Étiquette : Le texte affiché sur le bouton.

    • Nom de l'icône : Choisir une icône pour accompagner l'étiquette (optionnel).

    • Variante : Sélectionner un style visuel pour le bouton (par exemple : de base, neutre, marque, destructeur).

    • Et plus : Explorez les propriétés du bouton pour personnaliser davantage son apparence et son comportement.

Étape 2 : Afficher en ligne (optionnel) :

  • Contrôlez l'agencement de vos boutons. Par défaut, les boutons d'un groupe sont empilés verticalement. Activez l'interrupteur « Afficher en ligne » pour les disposer horizontalement.

Étape 3 : Menu de boutons (optionnel) :

  • Gérez la visibilité des boutons et optimisez l'espace. Si vous avez de nombreux boutons, vous pouvez utiliser la fonctionnalité « Menu de boutons » pour créer un menu déroulant contenant des boutons supplémentaires. Cela permet de garder votre interface propre et organisée tout en offrant l'accès à toutes les actions disponibles.

    • Personnaliser le bouton de menu : Configurez l'étiquette, l'icône et la variante du bouton qui déclenche le menu déroulant.

    • Contrôler les boutons visibles : Spécifiez le nombre de boutons devant être visibles par défaut. Tous les boutons restants seront placés dans le menu déroulant.

Pourquoi utiliser le composant Groupe de Boutons ?

  • Organiser les actions : Groupez les actions liées pour une expérience utilisateur plus intuitive.

  • Améliorer l'attrait visuel : Présentez les boutons de manière visuellement attrayante et organisée.

  • Optimiser l'espace : Utilisez le menu pour gérer de nombreux boutons sans encombrer l'interface.

  • Renforcer la cohérence : Maintenez un style et une mise en page cohérents pour les boutons dans toute votre application.

Exemples d'utilisations

  • Barre d'outils : Créez une barre d'outils avec des boutons pour des actions courantes comme « Nouveau », « Modifier », « Supprimer » et « Enregistrer ».

  • Navigation : Regroupez les boutons de navigation pour un accès facile aux différentes sections de votre application.

  • Actions de formulaire : Combinez les boutons « Soumettre » et « Annuler » en une unité visuellement cohésive.

  • Actions de workflow : Présentez un ensemble d'actions liées à un flux de travail ou à un processus spécifique.

En utilisant efficacement le composant Groupe de Boutons, vous pouvez créer des interfaces conviviales qui rationalisent les interactions et guident les utilisateurs vers les actions souhaitées

Mis à jour

Ce contenu vous a-t-il été utile ?