أظهار وأخفاء العناصر عبر Stencil Buffer في محرك Unity

بالتأكيد قرارك بأن تصبح مطور العاب لم يأت من اكلك السمبوسه, وانما من كونك لاعبا قبل هذا, فسواءً كنت لاعبا عاديا او مخضرما فلابد انك خلال رحلاتك بمختلف الالعاب مررت بشتى الانواع من البيئات والعوالم.

فمنها التي تقع في الفضاء أو على القمر, وبالطبع لا ننسي الغالبية التي تحدث على كوكبنا, ومن هاته ما يقع على الأرض مثل جهاز الإنذار التلقائي الكبير, او في السماء كـ Microsoft Flight Simulator, او حتي Hollow knight والتي تضعك في تجربة تحت الأرض.

لكن عليك أن لا تنسي من كل هذا لعبتي  Sea of Thieves, Skull and Bones والتي لا تقع فوق او تحت او على الارض, وانما تقع فوق هذا العالم المجهول الذي يشغل معظم حيز كوكبنا, واعني هنا الماء.

و بطبيعتنا نرغب بالسفر عبر هذا الماء, ولهذا اخترعنا هذا الشيء الذي يسمى قارب, والذي سمح لنا بالطفو فوق الماء بدون الغرق.

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

فكرة العمل

ان كنت قد أخذت نظرة على المُعدل البولياني-Boolean Modifier, فقد تظن انها الطريقه لتنفيذ ما تريده هنا, ونوعا ما نعم يمكنك استعمالها في هذه الحالة بداخل المحرك.

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

ما تريده هنا هو أن يتجاهل المعالج الرسومي جميع الأجزاء الخاصة بالمياه والتي تقع داخل حيز القارب ويمكن تنفيذ هذا بسهولة باستخدام شيء مثل قناع من شكل ما, والذي يكون مسؤولا فقط عن اخبار المعالج الرسومي بأن لا يظهر أي ماء في حيز هذا القناع.

ولتنفيذ شيء كهذا سنستعين بتقنية المرسام – Stencil, والتي تسمح لك باضافة شيدر خاص لأي مجسم بحيث يعمل كالقناع, والذي يظهر او يخفي عناصر معينة يمكن تحديدها برقم خاص.

تجهيز المشروع

اولا جهز المشروع بتغيير نظام الرسومات فيه، لتصبح قادرا على استعمال محرر الشيدر.
من خلال قائمة Window >> Package Manager >> Universal RP ثم تثبته في مشروعك.

بعدها اصنع ملف URP Asset، وهو ملف للتحكم باعدادات نظام الرسوميات الجديد، وتجده من خلال قائمة التصيير – Rendering في نافذة المشروع ثم اختيار URP Asset with Universal Renderer ، ثم تأكد من تفعيل نسيج العمق – Depth Texture ونسيج العتامة – Opaque Texture والـ HDR فيه.

بعد هذا تطبق المعالجة النهائية – Post Process، عن طريق نافذة التسلسل – Hierarchy، واضافة نطاق عام – Global Volume من خلال قائمة النطاق – Volume، ومن نافذة المشروع تنشيء مُعرف النطاق – Volume Profile.

ثم إضافة تاثير الوهج – Bloom، والـ Vignette، الى مُعرف النطاق. ويمكنك اضافة اي تاثير اخر تريده.
اخيرا فعل المعالجة النهائية – Post Process في الكاميرا.

وقد استعملت هنا هذا القارب والذي صنع بواسطة emelyarules.

شيدر القناع – Mask

اول خطوة ستكون البدء بكتابة الشيدر, من خلال قائمة Create >> Shader >> Unlit Shader.

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

وليس عليك فهمه في الحقيقة, يكفيك فقط نقله في حالة لم تكن تعرف اساسيات كتابة الشيدر, فكما الحال عند كتابتك الشيفرة, لن يمكنك فهمها إن لم تكن متمكنا من الاساسيات.

Shader "Unlit/StencilMask"
{
    Properties
    {
        _StencilRef("Stencil Ref", Range(0,255)) = 0
    }
    SubShader
    {
        Tags { "RenderType"="Opaque" "Queue" = "Geometry"}


// تعطيل قابلية الرؤية
        ColorMask 0
        ZWrite off


// إضافة المرسام
        Stencil{
// تعيين قيمة المرجع الخاص بالشيدر
            Ref[_StencilRef]
// تعيين اختبار المرسام لينجح دائما 
            Comp always
// في حالة نجاح الاختبار تستبدل قيمة مخزن المرسام - Stencil Buffer بقيمة الـ Ref في المنطقة التي يشغلها هذا القناع 
            Pass replace
        }
// باقي الشيدر
        Pass
        {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            struct appdata
            {
                float4 vertex : POSITION;
            };


            struct v2f
            {
                float4 vertex : SV_POSITION;
            };
            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                return o;
            }
            fixed4 frag (v2f i) : SV_Target
            {
                return fixed4(1,1,1,1);
            }
            ENDCG
        }
    }
}

وما عليك سوى انشاء خامة من هذا الشيدر ووضعها علي المجسم الخاص بالقناع, وبعدها تعيين قيمة المرجع لأي شيء تريده, ولكن تذكر أن اقصاك هو 255.

وفي حالتي وجدت أن استعمال مجسم المسطح – Plane الافتراضي يفي بالغرض.

والان بعد انتهائك من القناع يأتي دور العمل على ما تريد اخفائه, وهو الماء في حالتنا.

خاصية تصيير الماء

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

ولكن لحسن الحظ يوجد حل لهذا وهو استعمال خاصية تصيير العناصر عن طريق الذهاب لملف الـ URP Asset Renderer واضافة خاصية تصيير جديده – Add Renderer Feature واختيار تصيير العناصر – Render Objects.

ولكن قبل هذا تأكد من إخفاء الطبقة – Layer التي يوجد بها العنصر الذي يحمل شيدر المياه عن طريق إلغاء تحديدها, ولاحظ اني هنا اخترت طبقات العتامة – Opaque Layer لان شيدر المياه عندي نوعه هكذا, وفي حالة كان الذي عندك من النوع الشفاف فعليك إلغاء تحديده من طبقات الشفافية – Transparent Layer.

وبفعلك هذا لن يمكنك إلا رؤية العناصر التي تقع في الطبقات التي بقيت محددة فقط, وما نريده بعد ذلك هو التحكم بما نريد رؤيته من الماء بواسطة المرسام من خلال تفعيله في خاصية التصيير التي أنشأتها توا.

ومن خلالها تحدد الحدث ليكون بعد تصيير العتامة – AfterRenderingOpaques, والمقصود به هنا أن كل العناصر التي تقع تحت هذه الخاصية تظهر دائما بعد عملية إظهار الكائنات المعتمة, والتي منها شيدر القناع الذي معنا.

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

والان يظل أن تفعل جزئية المرسام وتحديد قيمته لتساوي نفس قيمة المرجع في القناع التي اخترتها مسبقا, ومن ثم تحديد اختبار المرسام ليكون عدم المساواة – Not Equal, ولكن لماذا؟

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

ويمكنك أن ترى كيف كانت تقنيه مثل هذه حلا للمشكلة, والتي ربما لم تتوقعها بسبب ان معظم استعمالات المرسام تميل للأشياء الجمالية أكثر.

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