Ecme logoEcme logo
داشبورد
    فروشگاه آنلاین
    پروژه
    بازاریابی
    تحلیل
مفاهیم
    هوش مصنوعی
      گفتگو
      تصویر
    پروژه‌ها
      تابلوی اسکرام
      فهرست
      جزئیات
      وظایف
      مسائل
    مشتریان
      فهرست
      ویرایش
      ایجاد
      جزئیات
    محصولات
      فهرست
      ویرایش
      ایجاد
    سفارش‌ها
      فهرست
      ویرایش
      ایجاد
      جزئیات
    حساب کاربری
      تنظیمات
      سابقه فعالیت
      نقش‌ها و دسترسی‌ها
      تعرفه‌ها
    مرکز راهنمایی
      مرکز پشتیبانی
      مقاله
      ویرایش مقاله
      مدیریت مقاله
    تقویم
    مدیریت فایل
    ایمیل
    گفتگو
اجزای رابط کاربری
    عمومی
      دکمه
      شبکه
      تایپوگرافی
      نمادها
    بازخورد
      هشدار
      پنجره گفتگو
      منوی کشویی
      نوار پیشرفت
      پیش‌نمایش
      نشانگر بارگذاری
      پیام موقت
    نمایش اطلاعات
      تصویر کاربر
      نشانک
      تقویم
      کارت‌ها
      جدول
      برچسب
      خط زمان
      راهنمای ابزار
    فرم‌ها
      کادر انتخاب
      انتخابگر تاریخ
      کنترل‌های فرم
      ورودی
      گروه ورودی
      دکمه رادیویی
      بخش
      انتخابگر
      کلید دوحالته
      ورودی زمان
      بارگذاری
    ناوبری
      منوی کشویی
      منو
      صفحه‌بندی
      گام‌ها
      زبانه‌ها
    نمودار
      نمودارها
      نقشه‌ها
احراز هویت
    ورود به سیستم
      ساده
      کناری
      دوبخشی
    ثبت‌نام
      ساده
      کناری
      دوبخشی
    بازیابی رمز عبور
      ساده
      کناری
      دوبخشی
    بازنشانی رمز عبور
      ساده
      کناری
      دوبخشی
    تایید رمز یکبار مصرف
      ساده
      کناری
      دوبخشی
سایر
    دسترسی غیرمجاز
    صفحه فرود
راهنما
    مستندات
    اجزای اشتراکی
    ابزارها
    تاریخچه تغییرات
حق نشر © 2026 Ecme تمامی حقوق محفوظ است.
شرایط و ضوابط | حریم خصوصی و سیاست

پیشرفت (Progress)

یک بارگذاری پیشرفت، پیشرفت جریان عملیات را به صورت بصری نمایش می‌دهد.

نوار پیشرفت (Progress Bar)

پیشرفت در نوار پیشرفت توسط پراپ percent کنترل می‌شود.
30%

دایره (Circle)

به طور جایگزین، می‌توانیم پیشرفت را در دایره نمایش دهیم با تنظیم پراپ variant به 'circle'
40%
70%

رنگ‌ها (Colors)

ما می‌توانیم رنگ سفارشی برای نوار پیشرفت اعمال کنیم. گزینه‌های رنگ موجود بر اساس theme.colors در Tailwind هستند.
20%
30%

اندازه (Size)

تنظیم اندازه پیشرفت از طریق پراپ size برای نوار پیشرفت یا پراپ width برای پیشرفت دایره‌ای.
60%
40%

اطلاعات سفارشی (CustomInfo)

ما می‌توانیم هر محتوای سفارشی را از طریق customInfo وارد کنیم.

40%

کامل شدن

دینامیک (Dynamic)

مثالی از پیشرفت دینامیک.
20%
20%

API

پیشرفت (Progress)
ویژگیتوضیحاتنوعپیش‌فرض
colorرنگ سفارشی برای پیشرفت، گزینه‌های رنگ موجود بر اساس theme.colors در Tailwind.stringرنگ پیش‌فرض تم
customInfoمحتوای سفارشیstring | ReactNode-
gapDegreeزاویه شکاف در پیشرفت دایره‌ای (فقط زمانی که variant="circle" است قابل استفاده است).number0
gapPositionموقعیت شکاف در پیشرفت دایره‌ای (فقط زمانی که variant="circle" است قابل استفاده است).'top' | 'right' | 'bottom' | 'left' 'top'
percentمقدار فعلی پیشرفتnumber0
showInfoآیا اطلاعات پیشرفت نمایش داده شود یا خیرbooleantrue
sizeاندازه نوار پیشرفت (فقط زمانی که variant="line" است قابل استفاده است)'sm' | 'md''md'
strokeLinecapسبک خط نوار پیشرفت (فقط زمانی که variant="circle" است قابل استفاده است)'round' | 'square''round'
strokeWidthعرض پیشرفت دایره‌ای (فقط زمانی که variant="circle" است قابل استفاده است)number6
trailClassکلاس CSS برای مسیر پیشرفتstring-
variantنوع پیشرفت'line' | 'circle''line'
widthاندازه پیشرفت دایره‌ای (فقط زمانی که variant="circle" است قابل استفاده است)number | string'line'
فهرست مطالب
  • نوار پیشرفت (Progress Bar)
  • دایره (Circle)
  • رنگ‌ها (Colors)
  • اندازه (Size)
  • اطلاعات سفارشی (CustomInfo)
  • دینامیک (Dynamic)