Ajouter une barre de progression à une page
Ajoutez un composant Progression à une page d'application pour afficher l'avancement d'une valeur vers un objectif sous forme de barre.
- 4 minutes
- Débutant
- 8 octobre 2026
Dans ce tutoriel, vous allez ajouter une barre de progression à une page d'application pour afficher l'avancement d'une valeur vers un objectif, par exemple le nombre de places réservées sur une capacité totale.
1. Ajouter un composant Progression
Sur une page de votre application, glissez le bloc Progression, situé dans la section Graphiques et visualisation de la barre latérale des composants, vers un container de la page.
2. Renseigner le titre et le sous-titre
Complétez les champs Titre et Sous-titre pour indiquer ce que représente la barre.
3. Associer les deux valeurs
Dans la section Valeurs, associez Valeur 1 à la valeur actuelle et Valeur 2 à la valeur cible.
La barre se remplit selon la proportion entre les deux.
4. Ajouter un texte après la valeur
Renseignez le champ Texte après la valeur si vous voulez ajouter une unité ou une précision, par exemple « places réservées ».
Résultat
La barre affiche la Valeur 1 rapportée à la Valeur 2, avec votre titre, sous-titre et texte de précision. Elle se met à jour automatiquement lorsque les données sources changent.
