Barre d'avancement
Parfois, un numéro compte le plus Une cible de collecte de fonds, une étape importante du projet, une maîtrise des compétences L'élément de barre de progression Master Addons fait de cette métrique unique une pièce maîtresse visuelle Choisissez parmi plusieurs styles engageants : modèles de lignes classiques, de cercles radiaux, ou de modèles uniques de votre objectif, puis personnalisez chaque partie C'est l'élément parfait ou l'élément de barre de progression pour concentrer l'attention, visualiser la réalisation et motiver l'action autour d'un objectif clé.
Plusieurs préréglages de style visuel
Un seul numéro peut être affiché de plusieurs façons Sélectionnez le style visuel qui correspond à la personnalité de votre page Choisissez la barre Line simple et propre pour les mises en page horizontales Optez pour le Cercle pour une jauge radiale compacte Rendre le jeu avec la forme Fan ou ajouter une Bulle dynamique qui se déplace avec la progression sur le style de ligne Chaque préréglage offre une façon distincte de visualiser l'avancement, en s'assurant que votre barre de progression fait toujours partie intégrante de la conception, et non une réflexion après coup.
- Quatre styles distincts : choisissez parmi les préréglages Line, Circle, Fan et Line Bubble.
- Radial vs. Linéaire : Utilisez Circle et Fan pour des indicateurs de progression compacts et radiaux dans les espaces restreints.
- Animationd Bubble : Le style Line Bubble ajoute un point de terminaison mobile qui met en évidence la valeur actuelle.
Personnalisation du contenu et de la valeur
La configuration de votre barre de progression est simple Dans l'onglet Contenu, donnez-lui un Titre significatif comme “Project Funding” ou “Customer Satisfaction Ensuite, définissez la Valeur (Valeur (Valeur : pourcentage) très important qui définit à quel point la barre ou le cercle doit être plein Ce processus simple en deux étapes est tout ce dont vous avez besoin pour obtenir un indicateur de progression fonctionnel et dynamique en direct sur votre page.
- Entrée simple : seulement deux champs : Titre et Valeur (Pourcentage).
- Aperçu en direct : consultez la mise à jour du titre et de la valeur en pourcentage dans l'éditeur au fur et à mesure que vous tapez.
- Affichage dynamique : Le remplissage de la barre, du cercle ou du ventilateur s'ajuste automatiquement au pourcentage exact que vous saisissez.
Style de barre de progression
Stylez la Barre Arrière (la piste vide ou l'arrière-plan) et la Barre Avant (le remplissage coloré) indépendamment Pour la Barre Avant, choisissez sa Couleur et contrôlez sa Largeur (ou épaisseur).Pour la Barre Arrière, définissez sa propre couleur et son style Cette séparation vous permet de faire ressortir clairement la progression sur l'arrière-plan, en assurant une lisibilité et un impact visuel maximum.
- Style à double barre : Stylez la barre avant (progrès) et la barre arrière (piste) avec des couleurs complètement différentes.
- Contrôle d'épaisseur : ajustez la largeur du remplissage de progression, particulièrement utile pour les styles Line et Circle.
- Hiérarchie visuelle claire : utilisez des couleurs contrastées pour rendre la partie terminée instantanément évidente.
Conception d'étiquettes et de valeurs
Utilisez les sections de style Titre et Valeur pour concevoir votre texte Définissez le titre et choisissez sa police Typographie Couleur, taille et poids La valeur (le nombre de pourcentage) peut être stylisée pour mettre l'accent, ce qui la rend souvent plus grande ou plus audacieuse que le titre Cette approche intégrée garantit que tous les éléments de votre barre de progression se sentent comme un composant unifié et conçu sur mesure.
- Style spécifique au texte : contrôles séparés pour le style de l'étiquette Titre et du pourcentage de valeur.
- Contrôle de la typographie : utilisez le panneau Typographie pour un contrôle précis de la police sur le texte du titre.
- Accent mis sur le nombre : stylisez souvent la valeur pour qu'elle soit plus visible, en attirant l'attention sur la métrique clé.
Foire aux questions pour la barre de progression
Quelle est la principale différence entre ceci et l'élément « Progressbars » (groupe) ?
Cet élément est pour un seul indicateur de progression remarquable Il offre des préréglages de forme uniques (Cercle, Ventilateur, Bulle) et est conçu pour être un point focal Le Élément Progressbars est pour créer des listes ou des groupes de plusieurs barres (comme une liste de compétences), le tout dans un style linéaire similaire.
La barre/le cercle s'anime-t-il lorsque la page se charge ?
Oui, généralement Pour engager les visiteurs, le remplissage de progression (Front Bar) doit animer de 0 % à votre valeur définie lorsque l'élément est visible sur la page, créant ainsi un effet fluide et dynamique.
Puis-je utiliser le style Circle pour afficher une note sur 100 ?
Absolument Le style Circle (et Fan) est parfait pour cela Définissez votre Valeur sur le score (par exemple, 85 pour 85 %).L'élément remplira l'arc radial en conséquence, créant une visualisation de jauge ou de notation claire.
La « Bulle » dans le style Line Bubble est-elle personnalisable ?
Oui. Il y a un paramètre de couleur de bulle et de position de bulle Vous pouvez modifier la couleur de la bulle et ajuster l'endroit où elle se trouve le long de la piste par rapport au point final du remplissage.
Widgets et extensions d'éléments tendance
Construisez des sites Web sophistiqués en moins de temps.
Glassmorphisme
Extras de conteneurs
Modèles
Duplicateur de messages/pages
