يوجد نوعان من النماذج في إيبلان، يختلفان في خصائص النماذج. التعامل مع النماذج:

• النماذج الثابتة: في هذه النماذج، تكون الرسومات المحتملة المتوفرة هي نفسها في كل صفحة من صفحات التقرير، ويكون ارتفاع صفوف البيانات التي تم تحليلها ثابتًا.
• النماذج الديناميكية: في هذه النماذج يتم بناء الرسومات إن وجدت بشكل ديناميكي، ومن الممكن إضافة ما يسمى “المناطق الديناميكية”. يمكن جعل ارتفاع الخط متغيرًا باستخدام خاصية نموذج ضبط ارتفاع الخط ديناميكيًا، ويمكنك دمج التقارير من وظائف متعددة في صفحة التقارير.

تشرح الأقسام التالية المناطق الديناميكية الفردية التي يمكن إضافتها إلى نموذج ديناميكي (عبر عناصر القائمة إدراج > المنطقة الديناميكية > ... في محرر النماذج).
صالح لجميع المناطق: لا يؤخذ في الاعتبار عرض المنطقة المحدد في محرر النماذج، بل يتم تحليل الارتفاع فقط. بالإضافة إلى ذلك، يجب أن تأخذ في الاعتبار أن التقرير يبدأ من الموضع الذي توجد فيه نقطة الإدراج الأولى؛ على سبيل المثال، إذا قمت بإزالة رأس من نموذج دون نقل مناطق البيانات، فسيبدأ التقرير عند موضع نقطة الإدراج الخاصة بمنطقة البيانات.

باستخدام خصائص النموذج عدد الصفوف وارتفاع الصف، حدد الحد الأقصى لحجم منطقة التقرير على الصفحة: يتم ضرب القيمتين، وبالتالي القيمة (بالمم) للحد (غير المرئي) لمنطقة التقرير تم العثور على ما بعده. يتم حساب خط الحدود مع الأخذ بعين الاعتبار نهاية الرأس. إذا كان عدد الخطوط = 20 وارتفاع الخط = 10 مم، فإن التقرير ينكسر على ارتفاع 20 × 10 مم = 200 مم.

تعليق:

يمكن أن توجد كل منطقة ديناميكية مرة واحدة فقط في النموذج، وإلا فسيتم عرض رسالة ويتم تجاهل المنطقة الثانية.

رأس الصفحة

يتم تكرار رأس التقرير لكل جهاز. إذا تم تحديد خانة الاختيار دمج (في مربع الحوار الإعدادات: الإخراج إلى الصفحات)، فسيتم دمج التقارير من وظائف متعددة في صفحة التقرير ويتم تكرار الرأس في كل بداية للصفحة وقبل تحليل الوظيفة التالية.

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

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

عنوان

بشكل افتراضي، يتم تكرار رأس كل وظيفة تقرير، ولكن من الممكن تشغيل تقرير في منطقة معينة كرأس عمود عن طريق تعيين خاصية النماذج تكرار رأس العمود الجديد.

من الممكن تعريفه في شكل عدة عناوين، إذا كان من الضروري، على سبيل المثال، إظهار مواقع التثبيت التي توجد عليها الشرائط الطرفية في مواصفات الشريط الطرفي. للقيام بذلك، حدد خاصية النموذج قم بإنشاء عناوين لخصائص فرز x الأولى وقم بتعيين الإعداد المطلوب لحقل إعدادات الفرز في مربع الحوار التقارير (عبر الخاصية المقابلة في علامة التبويب قوالب).

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

تعليق:

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

منطقة البيانات

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

تذييل منطقة البيانات

هذه المنطقة هي "المعادل العكسي" للرأس، أي أنها تظهر في منطقة البيانات وقبل تحليل الوظيفة التالية. يمكنك هنا، على سبيل المثال، تحديد سطر يشير بشكل مرئي إلى اكتمال تقرير الوظيفة.

تذييل

يتم تحليل التذييل مرة واحدة لكل صفحة، أي ليس لكل وظيفة. وفي النماذج ذات الأعمدة المتعددة، يقع بعد العمود الأخير.

تعليق:

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

الغرض من الدرس

في هذا البرنامج التعليمي، سوف نتعلم كيفية إنشاء خلفية مجردة حديثة في Adobe Illustrator تتكون من أشكال متجهة قياسية. سنقوم بعد ذلك بتحويل الأشكال القياسية إلى أشكال ديناميكية، مما سيسمح لنا بمعالجة معلماتها بسلاسة وحتى تحويلها إلى كائنات أخرى، مما يؤدي إلى إنتاج أعمال متجهة جديدة في غضون ثوانٍ. أصبح كل هذا ممكنًا بفضل الإصدار الجديد VectorScribe v2.

إنشاء خلفية مجردة من الأشكال القياسية الخطوة 1

لبدء هذا البرنامج التعليمي، دعونا نلقي نظرة سريعة على كيفية إنشاء خلفية مجردة باستخدام الأشكال القياسية في Adobe Illustrator. قم بإنشاء مستطيل باستخدام أداة المستطيل (M)، الذي يتوافق حجمه مع مساحة العمل واملأه بتدرج خطي ينقل توزيع الضوء في مشهدنا.

باستخدام أداة Ellipse Tool (L)، قم بإنشاء دائرتين يتطابق مركزاهما.

الخطوة 2

حدد كلتا الدائرتين، ثم انقر على Minus Front في لوحة Pathfinder.

املأ المسار المركب الناتج بتدرج خطي من الأبيض إلى الرمادي الفاتح.

دعونا نضيف تعبئة جديدة للنموذج من خلال النقر على الزر المقابل في لوحة المظهر.

حدد التعبئة السفلية في اللوحة، ثم انتقل إلى Effect > Distort & Transform > Transform... وقم بتعيين القيم لخيار Scale.

دعونا نغير اتجاه تدرج التعبئة السفلي إلى الاتجاه المعاكس.

الخطوه 3

لنقم الآن بإنشاء ظلال متساقطة من الكائن المجرد الذي تم إنشاؤه. لنرسم دائرة جديدة، والتي سنضعها أسفل المسار المركب. املأه بتدرج شعاعي يحتوي على اللون الأبيض ودرجتين من اللون الرمادي.

لنرسم دائرة بيضاء ونضعها كما هو موضح في الصورة أدناه.

حدد الدوائر التي تم إنشاؤها في هذه الخطوة، ثم انتقل إلى Object > Blend > Make. ثم انتقل إلى Object > Blend > Blend Options... وقم بتعيين العدد المطلوب من الخطوات.

بهذه الطريقة قمنا بإنشاء ظل داخل الحلبة.

الخطوة 4

لنقم بإنشاء دائرتين إضافيتين. الجزء السفلي مملوء باللون الأبيض، والجزء العلوي مملوء بتدرج خطي يتكون من درجتين من اللون الرمادي. يظهر موضع الدوائر في الشكل أدناه (تم إيقاف رؤية مزج الكائنات من أجل الوضوح).

لنقم بإنشاء كائن مزج من هذه الدوائر باستخدام الطريقة الموضحة في الخطوة السابقة.

سيصبح كائن المزج هذا قريبًا الظل الخارجي للحلقة.

الخطوة 5

قم بتجميع كلا كائني المزج.

اضبط وضع المزج على Multiply للمجموعة التي تم إنشاؤها في لوحة Transparency. الآن أصبحت الظلال المتساقطة شفافة.

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

تحويل النماذج القياسية إلى نماذج ديناميكية الخطوة 6

أصبح من الممكن الآن تحويل النماذج القياسية إلى نماذج ديناميكية باستخدام الإصدار الجديد من البرنامج الإضافي VectorScribe v2. يحتوي على وظيفة التعرف على الشكل التي تقوم بهذا التحويل. لنأخذ أداة الشكل الديناميكي ونحرك مؤشر الماوس فوق مسار أحد الأشكال القياسية.

كما ترون، ظهر تعليق توضيحي يشير إلى أن المكون الإضافي قد تعرف على النموذج. إذا نقرنا على النموذج، فإنه يصبح ديناميكيًا على الفور. وهذا يعني أنه يمكننا التحكم في معلماته في لوحة الأشكال الديناميكية وحتى تحويلها إلى شكل آخر.

الخطوة 7

يمكننا أيضًا تحويل جميع الأشكال الموجودة إلى أشكال ديناميكية، طالما أنها تمتلك الشكل الصحيح بالطبع. للقيام بذلك، افتح القائمة المنسدلة للوحة الأشكال الديناميكية وحدد تحويل إلى شكل ديناميكي.

يخبرنا البرنامج المساعد أنه تم تحويل 61 مسارًا، انقر فوق "موافق".

الخطوة 8

دعونا نحاول تغيير شكل جميع الكائنات الموجودة. حدد المضلع الديناميكي وقم بتعيين عدد الجوانب.

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

يبدو الأمر وكأنه خدعة سحرية، لكنها تعمل حقًا!

الخطوة 9

في الختام، أريد أن أقول إن VectorScribe v2 يمكنه أيضًا التعرف على الزوايا الدائرية وتحويلها إلى زوايا ديناميكية. قم بإنشاء مستطيل مستدير الزوايا باستخدام أداة Rounded Rectangle Tool.

استخدم أداة الزوايا الديناميكية وحرك المؤشر إلى إحدى الزوايا الدائرية. كما ترون، ظهر تعليق توضيحي يشير إلى أنه تم التعرف.

بعد النقر على مسار الشكل، سيتم تحويل الزاوية إلى ديناميكية ويمكن التحكم في نصف قطرها عن طريق سحب العلامة أو في لوحة Dynamic Corners.

لمعلوماتك، هذه ليست كل التحسينات التي تلقاها الإصدار الحالي من البرنامج الإضافي. بالإضافة إلى الميزات الجديدة، ستتلقى أداتين جديدتين تمامًا، يمكنك التعرف عليهما أو من خلال زيارة الصفحة

تعد النماذج اليوم إحدى أهم أدوات تفاعل المستخدم مع تطبيقات الويب. تسمح لك النماذج بتنظيم الإدارة الفعالة للمعلومات على الموقع، وحالة الموقع نفسه، وتقديم الخدمات للعملاء، ونقل المعلومات إلى مستخدمين آخرين، وتوفير الوصول إلى قسم مغلق، وغير ذلك الكثير... لذلك، هناك رغبة طبيعية تمامًا في جعل النماذج أكثر ملاءمة وتكيفًا مع الفروق الدقيقة في العمل .

يمكن أن يكون أحد مجالات هذا التحسين هو تنفيذ القدرة على التحكم بشكل تفاعلي، دون إعادة تحميل الصفحة، في عدد الحقول لإدخال البيانات، سواء المتزايدة أو المتناقصة. يمكن أن يكون هذا مناسبًا جدًا إذا كنت بحاجة إلى إضافة ليس سجلًا واحدًا، بل عدة سجلات إلى قاعدة بيانات التطبيق مرة واحدة؛ أو إذا كان عدد البيانات المماثلة غير معروف مسبقًا، حيث يتطلب كل منها حقل إدخال منفصل (على سبيل المثال، عدة هواتف مستخدمين أو بطاقات ائتمان). سنقوم في هذه المقالة بتحليل أحد التطبيقات البسيطة لهذه الميزة من خلال استخدام مكتبة jQuery javascript.

في الجزء السفلي، يمكنك تنزيل أرشيف مع الأمثلة التي تمت مناقشتها في هذه المقالة.

إضافة حقل جديد إلى النموذج.

سنقوم بإنشاء حقل نموذج جديد باستخدام طريقة .append():

$("selector").append("string");

الذي يضيف "سلسلة" إلى داخل العنصر باستخدام "المحدد" المحدد، مع السلسلة المضافة التي تتبع المحتوى الموجود.

إذا نظرنا إلى مثال محدد، فإنه يمكن أن يكون مثل هذا:

الحقل رقم 1 "/>أضف حقلاً جديدًا

يمكن تنفيذ وظيفة addField() نفسها على النحو التالي:

< script type= "text/javascript" >وظيفة addField () ( var telnum = parseInt($("#add_field_area" ) .find ("div.add:last" ) .attr ("id" ) .slice (3 ) ) 1 ; $("div#add_field_area" ) .append( "حقل رقم "telnum"");

أولاً، كالعادة، نقوم بتضمين مكتبة jQuery ثم نعلن عن وظيفة addField(). تقوم الدالة أولا بحساب الرقم الذي يجب إدراجه في العنصر الذي تتم إضافته - باستخدام هذا الرقم، سنقوم لاحقا بإزالة الحقول غير الضرورية. ثم يضيف addField() إلى div#add_field_area رمز كتلة div#add№ مع حقل نموذج بداخله، والذي يشبه رمزه تمامًا الكود "الحقل رقم 1" المشار إليه أعلاه مباشرةً. الآن عندما نضغط على زر "إضافة"، يمكننا أن نرى كيف يظهر حقل جديد على الفور.

حذف حقل نموذج معين.

لإزالة عناصر شجرة DOM، يمكنك استخدام التابع Remove() :

$("المحدد").remove();

والذي يتم تطبيقه على العنصر الذي يحتوي على "المحدد" المحدد. سنفترض أنه بشكل افتراضي يجب أن يبقى حقل واحد دائمًا، ويمكن حذف جميع الحقول الإضافية. للقيام بذلك، في وظيفة addField()، في سطر المعلمة لطريقة .append()، سنضيف رمز زر حذف الحقل، عند النقر فوقه، سيتم استدعاء وظيفة الحذف (id) والرقم سيتم تمرير الحقل الذي يجب حذفه إلى الوظيفة.

وظيفة addField () ( var telnum = parseInt($("#add_field_area" ) .find ("div.add:last" ) .attr ("id" ) .slice (3 ) ) 1 ; $("div#add_field_area" ) .append( "حقل رقم "telnum"");

يمكن أن تكون وظيفة حذف الحقل () نفسها بسيطة للغاية:

وظيفة حذف الحقل (المعرف) ( $("div#add" id).remove () ; )

هذا كل شئ. الآن، عند الضغط على زر (الصليب الأحمر) المقابل للحقل المحدد، سوف يختفي ومعه المعلومات التي تم تسجيلها فيه.

معالجة البيانات على الخادم (php).

عندما يحتوي النموذج على حقول متعددة بنفس نوع البيانات، فمن الطبيعي أن تطرح مسألة معالجة البيانات، على سبيل المثال، قبل إرسالها إلى قاعدة البيانات. في المثال أعلاه، تم حل هذه المشكلة عن طريق تحديد سمة الاسم لحقل النموذج باستخدام المعلمة val. وهذا يعني أنه بعد إرسال هذا النموذج باستخدام طريقة POST، سيتم وضع قيم هذه الحقول في المصفوفة $_POST['val')، والتي يمكن تكرار عناصرها في foreach (...) (. ..) حلقة، على سبيل المثال:

foreach ($_POST [ "val"] كقيمة $) (// الكود الخاص بك....)

أو، إذا لزم الأمر، "ألصق" جميع البيانات من هذه الحقول من نفس النوع في سطر واحد باستخدام الدالة implode():

$str = ينفجر ("|" , $_POST [ "val" ] ) ;

ثم سيتم دمج جميع قيم الحقول ذات الاسم = “val” في سلسلة ذات محدد “شريط عمودي”.

ولكن هذه معالجة من جانب الخادم، والتي، بالمناسبة، هي الأفضل لأسباب أمنية. ولكن، قد تنشأ ظروف تجبرك على معالجة هذه الحقول من جانب العميل: على سبيل المثال، ليس لديك حق الوصول إلى البرامج النصية للخادم (أنت تستخدم نوعًا ما من معالج النماذج عن بعد)، أو لسبب ما لا يمكنك تغيير تشغيل معالج النموذج على الخادم الخاص بك. في هذه الحالة، يمكنك أيضًا استخدام لغة جافا سكريبت، وبما أننا نعمل بالفعل مع مكتبة jQuery، فسوف نستمر في العمل فيها.

معالجة البيانات من جانب العميل.

لنفترض أن مهمتنا هي دمج جميع بيانات هذا الحقل المتعدد في سطر مفصول بشريط عمودي "|". في الواقع، يتم تنفيذ هذا بكل بساطة.

أولاً، نحتاج إلى تعديل النموذج نفسه قليلاً، أي إضافة حقل مخفي واحد: