رسم شبكة ديناميكي في محرك Unreal 4

في هذا البرنامج التعليمي Unreal Engine 4 ، ستتعلم كيفية رسم الألوان على أي نوع من الشبكات.

يسمح الرسم الشبكي للاعبين بتلوين الأشياء داخل اللعبة. أمثلة على الرسم الشبكي: الكتابة على الجدران (goop) في Super Mario Sunshine ، والمواد الهلامية في Portal 2 والحبر في Splatoon . يمكن استخدام الرسم كعنصر لعب أو أن يكون مجرد تصميم رسومي. كن على هذا النحو ، يفتح الرسم بالشبكات إمكانيات جديدة لمصممي اللعب والفنانين.

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

في هذا البرنامج التعليمي ، ستتعلم كيفية الرسم على شبكة الهيكل العظمي. للقيام بذلك ، سنقوم بما يلي:

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

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

ملاحظة: من المفهوم أنك تعرف بالفعل أساسيات العمل مع محرك Unreal. إذا كنت جديدًا على Unreal Engine ، فقم بزيارة سلسلة دروس Unreal Engine المكونة من 10 أجزاء للمبتدئين .

ملاحظة: هذا البرنامج التعليمي هو الجزء الرابع من سلسلة برامج تعليمية حول استخدام أهداف العرض في محرك Unreal:

• الجزء 1: الرسم باستخدام أهداف التقديم
• الجزء 2: ثلج مشوه
• الجزء الثالث: العشب التفاعلي
• الجزء 4: الرسم بالشبكة

للوصول إلى العمل

ابدأ بتنزيل مواد هذا البرنامج التعليمي. قم بفك ضغطها ، انتقل إلى MeshPainterStarter وافتح MeshPainter.uproject . انقر فوق تشغيل لرؤية الحرف الذي سنقوم بتلوينه.


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

أولاً ، دعنا نكتشف كيف يمكنك الرسم على شبكة.

رسم شبكة

في معظم الحالات ، تحتوي الشبكات التي يجب عليك العمل عليها بالفعل على فحص للأشعة فوق البنفسجية. لذلك ، سيكون من المنطقي إنشاء قناع باستخدام هدف التقديم ، ثم تطبيقه على الشبكة. ومع ذلك ، يؤدي إنشاء قناع مباشرة على هدف تجسيد (باستخدام Draw Material to Render Target) عادةً إلى فواصل في الأصداف فوق البنفسجية.

فيما يلي مثال لمسح المكعب بالأشعة فوق البنفسجية ونسيج القناع الكروي:


وهنا القناع المطبق على المكعب:


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

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

طريقة ريان

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


وها هي الشخصية بعد نشرها إلى Unreal:


يمكنك توسيع الشبكة باستخدام حسابات بسيطة للنزوح من مواقع العالم (التي سنناقشها أدناه).

الخطوة الثانية هي ترميز المواقف العالمية في تقديم الهدف. يمكن القيام بذلك عن طريق تعيين لون مادة المسح إلى Absolute World Position واستخدام التقاط المشهد لالتقاط عملية المسح. إليك ما سيبدو عليه هدف العرض:

ملاحظة: يؤدي عرض الهدف إلى تغيير اللون لأن الحرف متحرك. هذا يؤدي إلى تغيير مستمر في الموقف في العالم.

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

الخطوة الأخيرة هي تطبيق قناع على مادة الشخصية لخلط الألوان أو الأنسجة أو المواد. هنا تصور المرحلتين الثالثة والرابعة:


الآن دعونا نلقي نظرة على طريقي المقترح.

الطريقة المقترحة

على الرغم من أن طريقة ريان تعمل ، إلا أنه يحتاج إلى ما يلي:

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

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

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

الآن بعد أن أصبحنا على دراية بالطريقة ، فلنبدأ بإنشاء مادة مسح.

اصنع مادة مسطحة

انتقل إلى مجلد المواد وقم بإنشاء مادة جديدة. قم بتسميته M_Unwrap ، ثم قم بفتحه.

قم بتغيير الخيارات التالية:

• نموذج التظليل: غير مضاءة. وبفضل هذا ، لن يلتقط التقاط المشهد معلومات الإضاءة.
• ذو وجهين: ممكّن. في بعض الأحيان يمكن أن تبدو الوجوه الموسعة في الاتجاه الآخر (وهذا يعتمد على كيفية إجراء الأشعة فوق البنفسجية للشبكة). تضمن المعلمة ذات الوجهين رؤية جميع الوجوه المقلوبة.
• Usage / Used with Skeletal Mesh: ممكّن. عند تشغيل هذه المعلمة ، سيتم تجميع التظليل اللازم لكي تعمل المادة على شبكات الهيكل العظمي.

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


لذا سنقوم بإجراء مسح للأشعة فوق البنفسجية للشبكة في الموقع المحدد وبالحجم المحدد. لاحظ أنه إذا كان المسح الفريد للأشعة فوق البنفسجية لشبكتك في قناة منفصلة ، فستحتاج إلى تغيير فهرس الإحداثيات للعقدة TextureCoordinate . على سبيل المثال ، إذا كانت إحداثيات UV الفريدة في القناة 1 ، فيجب تعيين فهرس الإحداثيات على 1 .

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


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

من المهم ضبط عقدة الموضع العالمي المطلق على الموضع العالمي المطلق (باستثناء إزاحة تظليل المواد) . يعد ذلك ضروريًا لأن موضع البكسل في العالم سيتغير بسبب الانكماش. إن استبعاد إزاحة المواد Shader Offs يوفر لنا وضع البدء في العالم قبل النشر.

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

نشر الشخصية

في هذا البرنامج التعليمي ، سيقوم مخطط الكلاّب بالنشر والاستيلاء. أولاً ، نحتاج إلى مثيل ديناميكي لمادة المسح. انتقل إلى مجلد المخططات وافتح BP_Capture . ثم أضف العقد المميزة إلى Event BeginPlay . تأكد من تعيين Parent على M_Unwrap .


بعد ذلك ، نحتاج إلى وظيفة لإجراء عملية مسح وكسب. قم بإنشاء وظيفة جديدة تسمى PaintActor . ثم قم بإنشاء المدخلات التالية:

• ActorToPaint: يجب أن يكون للنوع القيمة Actor . هذا هو الممثل الذي سنقوم بعملية المسح والقبض عليه.
• HitLocation: اكتب Vector . ستكون هذه النقطة المركزية للقناع الكروي.
• BrushRadius: اكتب تعويم . نصف قطر القناع الكروي في وحدات العالم.

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


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


إليك ما يفعله كل سطر:

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

لاختبار المسح ، نحتاج أولاً إلى تتبع الخط من المشغل للحصول على نقطة التقاطع.

الحصول على نقطة التقاطع

انقر فوق ترجمة والعودة إلى المحرر الرئيسي. ثم أغلق BP_Player . افتح وظيفة التصوير وأضف العقد المميزة. في هذا البرنامج التعليمي ، قم بتعيين Brush Radius إلى 10 .


انقر على Compile وأغلق BP_Player . انقر فوق تشغيل ، ثم انقر بزر الماوس الأيسر على الحرف للتنقل وتطبيق قناع كروي.


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

الآن بعد أن قمنا بفك الشبكة ، نحتاج إلى إجراء التقاط شامل.

التقاط المسح

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


في هذا البرنامج التعليمي ، نستخدم وحدات 500 × 500 للكشف والتقاط ، لذلك يجب ألا يقل مستوى الخلفية عن هذه الأحجام. اضبط المقياس على (5.0 ، 5.0 ، 1.0) .


نظرًا لأن موضع الطائرة وموقع المسح هو نفسه ، سيكون من الجيد تغيير الطائرة إلى أسفل لتجنب التعارضات z. للقيام بذلك ، قم بتعيين قيمة الموقع (0.0 ، 0.0 ، -1.0) .


بعد ذلك نحتاج إلى إجراء التقاط. ارجع إلى وظيفة PaintActor وأضف العقد المميزة:


لذلك سنلتقط الشبكة الموسعة ، وبعد ذلك سيتم تطبيق المواد المصدر للشبكة مرة أخرى.

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


انقر فوق " ترجمة" ، ثم قم بإغلاق المخطط. الآن نحن بحاجة إلى استخدام هدف التقديم في المواد الشخصية.

استخدام القناع

انتقل إلى الأحرف \ Mannequin \ Materials وافتح M_Mannequin . ثم أضف العقد المميزة. قم بتعيين نموذج النسيج إلى RT_Capture .


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

انقر فوق تطبيق وأغلق المادة. انقر فوق تشغيل وانقر بزر الماوس الأيسر على الحرف لبدء الرسم.

إلى أين أذهب بعد ذلك؟

يمكن تنزيل المشروع النهائي من هنا .

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

• النمذجة مع وظائف المسافة Inigo Kileza
• التقديم الحجمي: دالات المسافة الموقعة ألانا زوكوني

إذا كنت تريد معرفة طريقة أخرى للرسم على شبكة ، فاقرأ مقال Tom Lohman Rendering Wounds on Characters . بدلاً من تراكم الأقنعة الكروية ، يستخدم عددًا ثابتًا من الأقنعة الكروية. ميزة هذه الطريقة هي رخصتها (التي تعتمد على عدد الأقنعة الكروية) والبساطة النسبية لتحريك الأقنعة. عيب هذه الطريقة هو التقييد الصارم على عدد الأقنعة الكروية.