Bouton

Le composant Bouton Avonni fournit des boutons personnalisables pour initier des actions, naviguer entre les pages ou exécuter des fonctions spécifiques.

Configuration Votre bouton

Ajouter un libellé

Le libellé est le texte affiché sur le bouton. Il doit communiquer clairement l'objectif du bouton et l'action qui se produira lorsque l'utilisateur cliquera dessus.

• Bonnes pratiques :

  • Utilisez des libellés concis et orientés action (par ex. « Enregistrer », « Envoyer », « Annuler », « En savoir plus »).

  • Évitez les libellés génériques comme « Cliquez ici ».

  • Assurez-vous que le libellé reflète précisément la fonction du bouton.

Choisir un style (variante)

Sélectionnez un style visuel qui s'aligne sur votre design et l'objectif du bouton. Le paramètre « Variante » contrôle l'apparence du bouton, y compris sa couleur, son arrière-plan, sa bordure et son style général.

Variantes disponibles :

• Nu : Un bouton en texte uniquement avec un style minimal, adapté aux actions discrètes.

• Nu inversé : Un bouton nu aux couleurs inversées, idéal pour une utilisation sur des arrière-plans sombres.

• De base : Un bouton standard avec un fond de couleur uni, adapté à un usage général.

• Bordure : Un bouton avec une bordure visible et un fond transparent, utile pour des actions moins proéminentes.

• Bordure remplie : Un bouton avec une bordure et un fond de couleur uni, un bon équilibre entre visibilité et style.

• Et bien d'autres ! Explorez la gamme complète de variantes dans le panneau des propriétés du composant pour trouver l'accord parfait avec votre design.

Améliorez votre bouton avec une icône pour renforcer l'action ou rendre le bouton plus attrayant visuellement.

• Bibliothèque d'icônes : Choisissez parmi une vaste bibliothèque d'icônes pour en trouver une qui correspond à l'objectif du bouton.

• Taille et position : Ajustez la taille de l'icône et positionnez-la à gauche ou à droite du texte du libellé.

Définir les interactions

C'est là que votre bouton prend vie ! L'onglet « Interactions » vous permet de définir ce qui se passe lorsqu'un utilisateur clique sur le bouton. Avonni propose une large gamme d'interactions intégrées, notamment :

• Navigation et retour utilisateur :

  • Navigation de flux : Contrôlez le flux de vos écrans, guidant les utilisateurs entre les écrans de manière fluide.

  • Afficher un Toast : Fournissez un retour non intrusif aux utilisateurs avec des notifications toast.

  • Naviguer : Liez à diverses pages au sein de Salesforce ou à des sites externes.

• Interaction avec les données :

  • Télécharger : Permettez aux utilisateurs de télécharger des fichiers associés aux enregistrements.

  • Exporter vers : Permettez aux utilisateurs d'exporter des données au format Excel ou CSV.

  • Mettre à jour les enregistrements : Enregistrez automatiquement les modifications effectuées.

  • Copier des enregistrements : Permettez aux utilisateurs de copier des données à partir des enregistrements du tableau de données.

• Engagement utilisateur et contrôle du flux :

  • Ouvrir une fenêtre d'alerte : Afficher des messages importants nécessitant l'accusé de réception de l'utilisateur.

  • Ouvrir une confirmation : Évitez les actions accidentelles grâce à des invites de confirmation par l'utilisateur.

  • Ouvrir une boîte de dialogue de flux : Lancer des flux Salesforce prédéfinis.

  • Ouvrir un panneau de flux : Faire glisser un panneau pour afficher un autre flux.

  • Lancer des confettis : Célébrez les actions des utilisateurs avec une animation de confettis.

• Actualisation des données :

  • Actualiser la requête : Mettre à jour les données affichées dans les composants Avonni.

  • Actualiser toutes les requêtes : Mettre à jour toutes les données provenant des sources de données de requête.

• Actions rapides :

  • Ouvrir une action rapide : Accédez rapidement aux actions Salesforce standard ou personnalisées