استخدام Corona SDK للتعامل مع الرسومات
المكون الأساسي لإنشاء الرسومات وإدارتها ومعالجتها في Corona SDK هو كائن العرض. ليس فقط يمكن استخدام هذا الكائن لعرض صورة من ملف ، وربما بنفس القدر من الأهمية ، يسمح لك بتجميع صورك معًا. يتيح لك ذلك نقل مجموعة كاملة من الرسومات حول الشاشة دفعة واحدة وطبقات الرسومات فوق بعضها البعض.
سيعلمك هذا البرنامج التعليمي أساسيات استخدام مجموعات العرض لتنظيم الكائنات الرسومية في مشروعك. سيتم توضيح ذلك من خلال إنشاء طبقتين مختلفتين ، واحدة تمثل الشاشة العادية وأخرى تمثل طبقة مشروطة لوضعها فوقها. بالإضافة إلى وضع الرسومات ، سنستخدم أيضًا كائن النقل لنقل المجموعة المشروطة بأكملها.
ملاحظة: لمتابعة هذا البرنامج التعليمي ، ستحتاج إلى صورتين: image1.png و image2.png. يمكن أن تكون هذه أي صور تختارها ، ولكن سيعمل البرنامج التعليمي بشكل أفضل إذا كان لديك صورًا حول 100 بكسل بمقدار 100 بكسل. هذا سوف يسمح لك بسهولة لرؤية ما يحدث للصور.
للبدء ، سنفتح ملفًا جديدًا باسم main.lua ونبدأ في إنشاء الشفرة:
displayMain = display.newGroup ()؛ displayFirst = display.newGroup ()؛ displaySecond = display.newGroup ()؛ global_move_x = display.contentWidth / 5؛يقوم هذا القسم من التعليمات البرمجية بإعداد مكتبة واجهة المستخدم الخاصة بنا ويعلن من خلال مجموعات العرض: displayMain، displayFirst and displaySecond. سنستخدمها لتدوين رسوماتنا أولاً ثم نقلها. يتم تعيين متغير global_move_x على 20٪ من عرض العرض حتى نتمكن من رؤية الحركة.
function setupScreen () displayMain: insert (displayFirst)؛ displayMain: إدراج (displaySecond)؛ displayFirst: toFront ()؛ displaySecond: toFront ()؛ local background = display.newImage ("image1.png"، 0،0)؛ displayFirst: إدراج (الخلفية)؛ local background = display.newImage ("image2.png"، 0،0)؛ displaySecond: إدراج (الخلفية)؛ النهايةتوضح وظيفة setupScreen كيفية إضافة مجموعات العرض إلى مجموعة العرض الرئيسية. ونستخدم أيضًا الدالة toFront () لإعداد طبقات الرسوم المختلفة ، مع الطبقة التي نريدها في كل وقت آخر تم تحديده.
في هذا المثال ، لا يلزم نقل الشاشة أولاً إلى الأمام ، نظرًا لأنه سيكون افتراضيًا أقل من مجموعة displaySecond ، ولكن من الجيد أن تدخل عادةً في كل مجموعة عرض بشكل واضح. معظم المشاريع ستنتهي بأكثر من طبقتين.
لقد أضفنا أيضًا صورة لكل مجموعة. عندما نبدأ التطبيق ، يجب أن تكون الصورة الثانية أعلى الصورة الأولى.
function screenLayer () displayFirst: toFront ()؛ النهايةلقد قمنا بالفعل بوضع الرسومات الخاصة بنا مع مجموعة displaySecond أعلى مجموعة displayFirst. هذه الوظيفة ستنقل العرض لأول مرة إلى الأمام.
function moveOne () displaySecond.x = displaySecond.x + global_move_x؛ النهايةتنقل وظيفة moveOne الصورة الثانية إلى اليمين بنسبة 20٪ من عرض الشاشة. عندما نسمي هذه الوظيفة ، ستكون مجموعة displaySecond خلف مجموعة العرض الأولى.
function moveTwo () displayMain.x = displayMain.x + global_move_x؛ النهايةتقوم وظيفة moveTwo بنقل الصورتين إلى اليمين بنسبة 20٪ من عرض الشاشة. ومع ذلك ، بدلاً من نقل كل مجموعة على حدة ، سنستخدم مجموعة displayMain لنقلها في وقت واحد. هذا مثال رائع لكيفية استخدام مجموعة عرض تحتوي على مجموعات عرض متعددة لمعالجة رسومات كثيرة في وقت واحد.
setupScreen ()؛ timer.performWithDelay (1000، screenLayer)؛ timer.performWithDelay (2000، moveOne)؛ timer.performWithDelay (3000، moveTwo)؛يوضح الجزء الأخير من الشفرة ما يحدث عند تشغيل هذه الوظائف. سنستخدم الدالة timer.performWithDelay لإيقاف الوظائف في كل ثانية بعد إطلاق التطبيق. إذا كنت غير معتاد على هذه الوظيفة ، فإن المتغير الأول هو وقت التأخير الموضح بالمللي ثانية والثانية هي الدالة التي نريد تشغيلها بعد هذا التأخير.
عند تشغيل التطبيق ، يجب أن يكون لديك image2.png على قمة image1.png. سيتم إطلاق الدالة screenLayer وإحضار image1.png إلى المقدمة. ستقوم وظيفة moveOne بنقل image2.png من تحت image1.png ، وستقوم الدالة moveTwo بإطلاق آخر ، مما يؤدي إلى تحريك الصورتين في نفس الوقت.
من المهم أن تتذكر أن كل مجموعة من هذه المجموعات قد تحتوي على عشرات الصور فيها. ومثلما حركت الدالة moveTwo الصورتين مع سطر واحد من التعليمات البرمجية ، فإن جميع الصور داخل المجموعة ستأخذ الأوامر المعطاة إلى المجموعة.
من الناحية الفنية ، يمكن أن تحتوي مجموعة displayMain على مجموعات وصور معروضة بداخلها. ومع ذلك ، من الممارسات الجيدة السماح لبعض المجموعات مثل displayMain بدور حاويات للمجموعات الأخرى دون أي صور لإنشاء تنظيم أفضل.
هذا البرنامج التعليمي يجعل استخدام كائن العرض. تعرف على المزيد حول كائن العرض.