انتقل إلى المحتوى
العربية
جميع الأدوات

الفئات

أدوات المطورينالترميز وفك الترميزJSON والبياناتالتجزئة والمجموع الاختباريأدوات النصوصالتاريخ والوقتأدوات الشبكاتأدوات الملفاتMarkdown والمخططات

مولّد مخططات الحالات

اكتب الانتقالات بين الحالات واحصل على مخطط آلة حالات مع الأحداث على الأسهم.

تتم المعالجة محليًا في متصفحك

الخيارات
مخطط نصي: انتقال في كل سطر، "من -> إلى: حدث". [*] هي البداية/النهاية. أو الصق كود "stateDiagram-v2".0 حرف · 0 سطر
ستظهر النتيجة هنا.

ما هي أداة مولّد مخططات الحالات؟

يصف مخطط الحالات (آلة الحالات المنتهية) الحالات التي يمكن أن يكون عليها كائن أو عملية والأحداث التي تنقله من حالة إلى أخرى. ويُستخدم في دورة حياة الطلبات ومسارات الواجهات ومعالجة البروتوكولات ومنطق الألعاب.

في الوضع السريع تكتب انتقالًا واحدًا في كل سطر "من -> إلى: الحدث"، وتستخدم [*] للبداية والنهاية. تحوّل الأداة ذلك إلى كود Mermaid من نوع stateDiagram-v2 مع أسماء مستعارة للأسماء التي تحتوي مسافات، وتعرض الكود المولَّد بجانب المخطط. ويمكنك أيضًا لصق كود stateDiagram الخاص بك مع حالات مركبة وتفرعات وملاحظات وضبط اتجاه التخطيط.

كيف تعمل؟

  1. اكتب الانتقالات مثل "Idle -> Processing: submit"، واحدًا في كل سطر، واستخدم [*] للحالة الابتدائية والنهائية.
  2. أو الصق كود stateDiagram-v2 للحالات المركبة والاختيارات والملاحظات.
  3. اختر اتجاه التخطيط والسمة.
  4. صدّر SVG أو PNG، أو انسخ كود Mermaid المولَّد.

حالات الاستخدام الشائعة

  • نمذجة دورة حياة طلب: أُنشئ، دُفع، شُحن، سُلّم، أُلغي.
  • توثيق مسار واجهة أو معالج مع الحدث الذي يسبب كل تغيير شاشة.
  • وصف بروتوكول شبكة أو آلة حالات اتصال.
  • تخطيط منطق لعبة أو محرك سير عمل قبل برمجته.

أمثلة

جرّب هذا المدخل في الأداة أعلاه:

stateDiagram-v2
    direction LR
    [*] --> Idle
    Idle --> Processing : submit
    Processing --> Success : ok
    Processing --> Failed : error
    Failed --> Idle : retry
    Success --> [*]

الخصوصية

تعمل أداة مولّد مخططات الحالات بالكامل داخل متصفحك. يُعالَج النص أو الملفات التي تقدّمها على جهازك ولا تُرفع ولا تُسجَّل ولا تُخزَّن على خوادمنا.

القيود

يغطي المخطط النصي السريع الانتقالات البسيطة فقط. أما الحالات المركبة والتفرعات والوصلات والاختيارات والملاحظات فتتطلب كود stateDiagram-v2. يرسم Mermaid المخطط لكنه لا يتحقق من اكتمال الآلة أو حتميتها.

الأسئلة الشائعة

كيف أحدد حالتي البداية والنهاية؟

استخدم [*] كمصدر للحالة الابتدائية ("[*] -> Idle") وكهدف للحالة النهائية ("Done -> [*]").

هل يمكن أن تحتوي أسماء الحالات على مسافات؟

نعم. يُعلن اسم مثل "بانتظار الدفع" كحالة ذات تسمية ومعرّف مولَّد، فتظل الانتقالات بصياغة Mermaid صالحة.

ما الفرق بين stateDiagram وstateDiagram-v2؟

stateDiagram-v2 هو محرك العرض الأحدث بتخطيط أفضل وميزات أكثر. ويولّد وضع المخطط النصي دائمًا كود v2.

أدوات ذات صلة

المزيد من الأدوات في Markdown والمخططات →