Прогресс Бар
Иногда, один номер имеет наибольшее значение. цель сбора средств, веха проекта, мастерство навыка. мастер аддоны элемент Прогрессбар делает эту единственную метрику визуальным центральным элементом. выбирайте из нескольких привлекательных стилей adclassic Line, радиальный круг, уникальный дизайн вентилятора и пузыря. Установите свою целевую ценность, затем настройте каждую часть. это идеальный элемент панели элементатора, чтобы сосредоточить внимание, визуализировать завершение и действие вокруг одной ключевой цели.
Несколько предустановок визуального стиля
Один номер можно показать многими способами. выберите визуальный стиль, который соответствует индивидуальности вашей страницы. выберите простую, чистую строку линии для горизонтальных макетов. выберите круг для компактного радиального калибра. Сделайте его игривым с формой вентилятора или добавьте динамический пузырь, который движется с прогрессом на стиле линии. Каждый предустановленный предлагает особый способ визуализации продвижения, гарантируя, что ваша полоса прогресса всегда является неотъемлемой частью дизайна, а не второстепенной мыслью.
- Четыре различных стиля: выберите один из предустановок "Линия", "Круг", "Вентилятор" и "Линия пузыря".
- Радиальный и линейный: используйте круг и вентилятор для компактных радиальных индикаторов прогресса в ограниченном пространстве.
- Анимированный пузырь: стиль Line Bubble добавляет движущуюся конечную точку, которая подчеркивает текущее значение.
Настройка контента и ценности
Настройка панели прогресса проста. на вкладке Содержимое, дать ему значимое Название, как “ Funding” или “Customer Satisfaction.” Затем установить значение — — — важный процент, который определяет, насколько полной должна быть полоса или круг. этот простой двухшаговый процесс - это все, что вам нужно, чтобы получить функциональный, динамический индикатор прогресса в прямом эфире на вашей странице.
- Простой ввод: всего два поля: Название и Значение (Процент).
- Предварительный просмотр в реальном времени: просматривайте обновление заголовка и процентного значения в редакторе по мере ввода.
- Динамический дисплей: полоса, круг или заполнение вентилятора автоматически регулируется в соответствии с точным процентом, который вы вводите.
Стиль бара Прогресс
Стиль Задняя панель (пустая дорожка или фон) и Передняя панель (цветная заливка) независимо Для передней панели выберите ее Цвет и контролировать ее Ширина (или толщина). для задней панели установите свой собственный цвет и стиль. это разделение позволяет вам сделать продвижение вперед четко выделяться на фоне, обеспечивая максимальную читаемость и визуальное воздействие.
- Стиль двух стержней: стилизовать переднюю планку (прогресс) и заднюю планку (дорожка) совершенно разными цветами.
- Контроль толщины: регулируйте ширину заполнения хода, что особенно полезно для стилей линии и круга.
- Ясная визуальная иерархия: используйте контрастные цвета, чтобы сделать завершенную часть мгновенно очевидной.
Дизайн этикеток и ценностей
Используйте разделы стилистики заголовка и значения для оформления текста. установите заголовок Цвет и выберите его Типография — шрифт, размер и вес. значение (процентное число) можно стилизовать для акцентирования, часто делая его больше или смелее, чем заголовок. Этот интегрированный подход гарантирует, что все элементы вашей индикации выполнения будут ощущаться как единый, специально разработанный компонент.
- Текстовый стиль: отдельные элементы управления для оформления этикетки заголовка и процентного значения.
- Управление типографикой: используйте панель "Типография" для точного контроля шрифта над текстом заголовка.
- Акцент на числе: часто стилизуйте значение как более заметное, привлекая внимание к ключевой метрике.
Часто задаваемые вопросы для Progress Bar
В чем главное отличие этого от элемента "Прогрессбары" (группа)?
Этот элемент предназначен для одного единственного, выдающегося индикатора прогресса. Он предлагает уникальные предустановки формы (Круг, Вентилятор, Пузырь) и предназначен для того, чтобы быть фокусным пунктом.The Элемент Progressbars предназначен для создания списков или групп из нескольких полос (например, списка навыков), все в одинаковом линейном стиле.
Анимирует ли полоса/круг при загрузке страницы?
Да, обычно. чтобы привлечь посетителей, заполнение прогресса (передняя панель) должно оживлять от 0% до заданного значения, когда элемент появляется в поле зрения на странице, создавая плавный, динамический эффект.
Могу ли я использовать стиль Круга, чтобы показать результат из 100?
Абсолютно. для этого идеально подходит стиль Круга (и Вентилятора).Поставьте значение на балл (например, 85 для 85%).Элемент заполнит радиальную дугу соответствующим образом, создавая четкую калибровку или визуализацию рейтинга.
Является ли "Пузырь" в стиле Line Bubble настраиваемым?
Да. есть настройка Цвет пузыря и Положение пузыря. можно изменить цвет пузыря и отрегулировать, где он находится вдоль дорожки относительно конечной точки заполнения.
Виджеты и расширения трендовых элементов
Создавайте сложные веб-сайты за меньшее время.
Стекломорфизм
Дополнительные контейнеры
Шаблоны
Дубликатор сообщений/страниц
