پرش به محتویات

Progress bar

المان Progress Bar نوارهای پیشرفت animate‌شده با برچسب‌ها، درصدها و استایل‌دهی قابل سفارشی‌سازی نمایش می‌دهد.

تنظیمات

  • Bars (repeater) — چندین نوار پیشرفت اضافه کنید. هر نوار شامل:
  • Label (text) — برچسب متنی برای نوار پیشرفت.
  • Percentage (number) — درصد پیشرفت (۰-۱۰۰). از dynamic data پشتیبانی می‌کند.

  • Bar color (color) — رنگ پر شدن نوار پیشرفت.

  • Height (number with units) — ارتفاع نوارهای پیشرفت. پیش‌فرض: 8px.

  • Spacing (number with units) — فاصله بین نوارهای پیشرفت. پیش‌فرض: 20px.

  • Show percentage (checkbox) — مقادیر درصد را کنار برچسب‌ها نمایش دهید. پیش‌فرض: فعال.

  • Bar color (color) — رنگ پیش‌فرض برای همه نوارهای پیشرفت.

  • Bar background color (color) — رنگ پس‌زمینه مسیر نوارهای پیشرفت.

  • Bar border (border) — استایل border برای نوارهای پیشرفت.

  • Label typography (typography) — تنظیمات فونت برای برچسب‌ها.

  • Percentage typography (typography) — تنظیمات فونت برای مقادیر درصد. فقط وقتی «Show percentage» فعال است نمایش داده می‌شود.

مرجع توسعه‌دهنده

JSON schema کامل: progress-bar Schema