انتقل إلى المحتوى الرئيسي
Disclaimer

The mentioned functionalities may be restricted depending on the purchased software license.

إدارة قوالب العرض العام

قوالب العرض العام هي أساس التصورات المخصصة الخاصة بك. إنها تحدد التخطيط، الهيكل، والعناصر المرئية التي ستطبق على تثبيتك. تغطي هذه الدليل الشامل كل شيء من إنشاء قوالب أساسية إلى تقنيات التصميم المتقدمة.


📋 نظرة عامة

ما هي قوالب العرض العام؟

تعمل القوالب كـ مخططات قابلة لإعادة الاستخدام:

  • 📐 تحدد التخطيطات المرئية لعرضك العام
  • 🧩 تنظم كتل المحتوى ومواقعها
  • 🎨 تؤسس استمرارية التصميم عبر تثبيتات متعددة
  • ⚙️ تمكن من نشر سريع للتصورات الموحدة
  • 🔄 تدعم التحديثات السهلة عبر جميع التكوينات المرتبطة

الفوائد الرئيسية

الفائدةالوصف
🚀 الكفاءةإنشئ مرة واحدة، استخدم عبر تثبيتات متعددة
🎯 التناسقحافظ على معايير تصميم موحدة
🔧 المرونةتعديل سهل دون الحاجة إلى إعادة الإنشاء من الصفر

🚀 البدء

سير عمل القالب

  1. 📐 تصميم التخطيط - خطط هيكلك المرئي
  2. 🎨 إنشاء القالب - قم بالبناء باستخدام محرر القوالب
  3. 💾 حفظ القالب - خزنه للاستخدام مرة أخرى عبر التثبيتات

المتطلبات المسبقة

قبل إنشاء القوالب، تأكد من أن لديك:

  • حساب SmartgridX مع الأذونات المناسبة
  • أهداف تصميم واضحة لتصورك
  • متطلبات المحتوى (صور، نقاط بيانات، تخطيطات)

🎛️ واجهة إدارة القوالب

الوصول إلى مدير القالب

infographicimage

خطوات التنقل:

  1. تسجيل الدخول إلى حسابك في SmartgridX
  2. انتقل إلى 'العرض العام' في الشريط الجانبي الرئيسي
  3. انقر على زر 'قالب العرض العام' في صفحة النظرة العامة

يفتح ذلك واجهة إدارة القوالب حيث يمكنك عرض، إنشاء، تحرير، وحذف القوالب.

جدول نظرة عامة على القوالب

infographicimage

الإجراءات المتاحة:

  • ➕ إضافة - زر أخضر لبدء إنشاء القالب
  • ✏️ تحرير - تعديل تصميم القالب الحالي
  • 🗑️ حذف - إزالة القالب غير المستخدم

🎨 عملية إنشاء القالب

بدء قالب جديد

انقر على زر "إنشاء قالب جديد" لفتح واجهة محرر القوالب.

تكوين رأس القالب

infographicimage

إعدادات العنوان

عنوان القالب:

  • الهدف: يحدد القالب في القوائم والتكوينات
  • أفضل الممارسات: استخدم أسماء وصفية تتناسب مع المشروع
  • أمثلة: "لوحة تتبع الأداء في المصنع"، "تخطيط مراقبة الطاقة"، "عرض متعدد المناطق"

تكوين الهوامش

إعدادات الهوامش تحدد المنطقة الآمنة من حدود العرض:

شريط تمرير الهوامش (0-100px):

  • 📐 النطاق: من 0 إلى 100 بكسل من حافة العرض
  • 🎯 الهدف: إنشاء مساحة آمنة لمنع قطع المحتوى
  • 📱 التطبيق: يضمن الرؤية على أنواع العرض المختلفة
  • ⚙️ التوصية: استخدم 10-20 بكسل لشاشات العرض العادية، 30-50 بكسل للشاشات ذات الحواف المتصلة

التأثير البصري:

  • 0 بكسل هامش - يمتد المحتوى إلى حواف العرض
  • 50 بكسل هامش - يبدأ المحتوى على بعد 50 بكسل من جميع الحدود
  • 100 بكسل هامش - أكبر منطقة آمنة مع مسافات حدودية كبيرة

وظيفة الحفظ

يتيح لك زر 💾 حفظ (في الزاوية العلوية اليمنى) حفظ قالبك الحالي.


🧩 نظام تخطيط الكتل

فهم نظام الشبكة

infographicimage

أساسيات الشبكة

يستخدم محرر القوالب نظام شبكة 100×100 يعتمد على النسب:

خصائص الشبكة:

  • 📐 الأبعاد: 100 وحدة عرض × 100 وحدة ارتفاع
  • 📊 الوحدات: قيم النسبة المئوية (1 وحدة = 1% من البعد الكلي)
  • 🎯 الدقة: يسمح بالتحديد الدقيق للموقع والحجم
  • 📱 الاستجابة: يتكيف تلقائيًا مع أحجام الشاشات المختلفة

أمثلة تخطيط الكتل

التكوين: 100 عرض × 100 ارتفاع
النتيجة: تغطية كاملة للشاشة
حالة الاستخدام: تصور كبير واحد، صورة بكامل الشاشة

┌─────────────────────────────────┐
│ │
│ FULL BLOCK │
│ │
│ │
└─────────────────────────────────┘

Manipulation of Blocks

إضافة كتل

الطريقة: انقر على زر "إضافة كتلة" (في الزاوية العلوية اليمنى من المحرر)
النتيجة: تظهر كتلة جديدة بأبعاد افتراضية
الخطوات التالية: ضعها وقم بتغيير حجمها حسب الحاجة

تحديد مواقع الكتل

السحب والإفلات:

  • 🖱️ انقر واستمر في الضغط على أي كتلة لتحريكها
  • 📍 المعاينة في الوقت الفعلي تظهر الموضع أثناء السحب
  • 🧲 التقاط الشبكة يساعد على التركيب الدقيق
  • 👁️ تظهر الأدلة البصرية للمساعدة في المحاذاة

تغيير حجم الكتل

مقبض تغيير الحجم:

  • 📐 الزاوية السفلى اليمنى تُظهر مقبض تغيير الحجم عند تحديد الكتلة
  • 🔧 اسحب لتغيير الحجم لكل من العرض والارتفاع في وقت واحد
  • 📊 تظهر القيم في الوقت الفعلي الأبعاد الحالية

عناصر التحكم الدقيقة

infographicimage

لوحة وضع الجانب الأيمن

عند تحديد كتلة، توفر اللوحة اليمنى:

عناصر التحكم في الموضع:

  • 📍 موضع X - الإزاحة الأفقية من الحافة اليسرى (0-100)
  • 📍 موضع Y - الإزاحة الرأسية من الحافة العلوية (0-100)
  • 🎨 مؤشر Z - ترتيب الطبقات للكتل المت overlapping
  • 📏 العرض - نسبة عرض الكتلة (1-100)
  • 📏 الارتفاع - نسبة ارتفاع الكتلة (1-100)

⚙️ تكوين الكتلة

أنواع الكتل والخصائص

infographicimage

الوصول إلى تكوين الكتلة

الطريقة:

  1. حدد كتلة في لوحة المحرر
  2. تظهر لوحة التكوين في أسفل الشاشة
  3. القائمة المنسدلة لنوع الكتلة هي الخيار الأساسي للتكوين

ملاحظة: ليست جميع الكتل قابلة للتكوين حالياً. سيتغير هذا مع استمرار التطوير. سيتم إضافة المزيد من أنواع الكتل في التحديثات المستقبلية.

أنواع الكتل المتاحة

الغرض: عرض الصور الثابتة، والشعارات، والخلفيات، وملفات GIF
خيارات التكوين:

  • 📁 مصدر الصورة - تحميل أو URL سيتم استخدامه كافتراضي لهذه الكتلة. يمكنك ترك هذا الحقل فارغاً إذا كنت ترغب في إجبار اختيار صورة في التكوين

حالات الاستخدام:

  • شعارات الشركات والعلامات التجارية
  • صور الخلفيات
  • صور المعدات
  • ملفات GIF

أمثلة على القوالب

infographicimage

توضح هذه المثال قالباً منظماً جيداً مع:

  • 📊 تنظيم كتلة واضح مع تسميات وصفية
  • 📐 تباعد ومحاذاة صحيحة
  • 🎯 أنواع كتل وظيفية لاحتياجات المحتوى المختلفة

تسمية الكتل في هذا المثال:

  • كل كتلة تظهر الغرض المقصود
  • تسمية واضحة تساعد في التكوين
  • تنظيم منطقي يدعم الصيانة

📚 الوثائق ذات الصلة

الخطوات التالية

بعد إنشاء القالب الخاص بك:

  1. ⚙️ تكوين التثبيتات - تطبيق القوالب على تثبيتات محددة
  2. 🎛️ ربط وحدات التحكم - الاتصال بالأجهزة المعروضة
  3. 🚀 دليل البدء - نظرة عامة كاملة على سير العمل

مواضيع متقدمة

  • 🎨 تقنيات التصميم المتقدمة
  • 📊 تكامل البيانات المخصصة
  • 🔄 تحديثات القوالب التلقائية
  • 👥 التعاون متعدد المستخدمين في القوالب

💡 ملخص أفضل الممارسات

تصميم القوالب

مبادئ التصميم:

  • 🎯 اجعلها بسيطة - ركز على المعلومات الأساسية
  • 📱 صمم بشكل استجابة - اختبر على أحجام شاشات مختلفة
  • 🎨 حافظ على الاتساق - استخدم ألوان وتصميمات موحدة

إدارة القوالب

نصائح التنظيم:

  • 📝 استخدم أسماء وصفية - اجعل القوالب سهلة البحث
  • 🔄 الصيانة المنتظمة - قم بإزالة القوالب غير المستخدمة
  • 👥 شارك المعايير - تأكد من اتساق الفريق

🎨 هل أنت مستعد للتصميم؟ مع مصمم قوالبك المنشأ والمكون، أنت جاهز لنشر تصورات مذهلة عبر تثبيتات SmartgridX الخاصة بك!