-
Title:
02-12 Fixing_Overdraw_with_Canvas_API
-
Description:
02-12 Fixing_Overdraw_with_Canvas_API
-
حسنًا، لقد عدنا مجددًا إلى برنامج
Android Studio،
-
لمراجعة مصدر DroidCardsView.
-
مجددًا، هذا هو العرض المخصص.
-
فقط لنتذكر، أنه في هذا العرض المخصص
قمنا بإنشاء أوراق اللعب المتراكبة.
-
على سبيل المثال،
كل بطاقة لها صورتها النقطية الخاصة بها،
-
ونحن نرسمهم على الشاشة
عن طريق التحكم في أسلوب onDraw.
-
وتذكر، أنه بالتحكم في أسلوب onDraw،
-
فلن يتمكن الأندرويد من تحسين
معالجة المشهد،
-
إنها مهمتنا نحن المطورون لاقتصاص
كل بطاقة بطريقة صحيحة
-
كما ستظهر على الشاشة
وذلك لتجنب تراكب الرسوم غير الضروري.
-
ولحسن الحظ، فأداة Canvas API
تعطينا الطرق الصحيحة التي نحتاجها
-
لرسم بطاقاتنا بطريقة أكثر فعالية.
-
فلنلقِ نظرة على التوثيق.
-
ولنستخدم طريقةcanvas.clipRect
لتحسين الكود خاصتنا.
-
سوف نستخدم هذا المتغير هنا والذي يحتوي
على أربعة متغيرات مثل البارامترات.
-
حسنًا، لقد عدنا الآن إلى
Android Studio
-
فلنقم بتعديل كيفية رسم كل بطاقة مدرجة
-
وسوف أستخدم تلك الخاصية الرائعة الموجودة
في Android Studio لإحضار مشهد مختلف
-
إلى المقدمة، حتى تتمكن من رؤية
حالة الكود قبل وبعد التعديل.
-
حسنًا، نحن هنا في مشهد المقارنة،
-
ولنلق نظرة خاصة على أسلوب onDraw
وهو الأسلوب الذي نتجاوزه.
-
لدينا الحالة القديمة لحلقة for التكرارية
على اليسار،
-
لكن فلنركز على التحسينات
التي سنقوم بها هنا على اليمين.
-
الآن، وبينما نكرر البطاقات،
فلنراجع كل خطوة من التحسينات.
-
رقم واحد أولًا سنقوم بحساب موضع البطاقة.
-
ثم سنقوم بتشغيل تلك الخاصية
canvas.save
-
التي ستحفظ حالة لوحة الرسم الحالية.
-
وبمعنى آخر،
-
فهي تحافظ على الوضع الحالي
للشاشة قبل تطبيق أداة clipRect API.
-
الآن، عندما نقوم بتشغيل طريقة clipRect،
-
فإننا بذلك نقوم بعمل بعض الحدود الهندسية.
-
وعندما نمرر هذه المتغيرات،
فنحن بذلك نخبر النظام
-
بأن يرسم فقط جزء البطاقة
الذي نريد أن يكون مرئيًا.
-
وبالطبع، بقية الأجزاء ستكون مخفية.
-
الآن، أجزاء البطاقة الموجودة
ضمن الحدود التي وضعناها فقط
-
هي الأجزاء التي سيتم رسمها فقط.
-
وأخيرًا، سنقوم بتشغيل canvas.restore،
-
والتي ستحول لوحة الرسم
إلى وضعية عدم الاقتصاص.
-
وبمعنى آخر،
-
سوف تقوم بإلغاء الحدود
التي وضعناها عندما قمنا بتشغيل clipRect.
-
ثم نقوم بإعادة تلك الحلقة التكرارية
لجميع البطاقات ما عدا الموجودة بالأعلى.
-
الآن وبشكل خاص سنقوم بمعالجة
-
البطاقة الأخيرة بشكل مختلف
عن نظيراتها الموجودة بالأسفل.
-
وبالنسبة لهذه البطاقة،
فلن نحتاج إلى الاقتصاص،
-
لذا سنقوم برسمها كاملة.
-
ويمكنك أن ترى ذلك من خلال
هذه الجملة الموجودة هنا.
-
حسنًا، فلنقم بإنشاء الكود المحسن،
-
لنرَ إن كنا قد قمنا بتقليل
كمية من تراكب الرسوم.
-
حسنًا، رائع!
-
كما ترى هنا، يوجد القليل من تراكب الرسوم.
-
آمل أن يكون مفهومًا أنه باستخدام
Canvas API يكون لدينا طريقة مباشرة
-
للرسم بطريقة فعالة عند العمل
على عروض مخصصة.
-
وفي حالة ما إذا رغبت باستكشاف
Canvas API أكثر،
-
فتأكد من مراجعة كامل التوثيق
الموجود في ملاحظات المدرب.
-
الآن، مشاهد مثل هذه تعتبر رائعة
لمساعدتنا على خلق
-
تجربة مستخدم فريدة وجذابة
لكن تذكر أننا يجب أن نعتمد على النظام
-
لمساعدة الأندرويد في معالجة
مثل هذه المشاهد بطريقة ذات فعالية.
-
إذن عندما تقوم بإنشاء عرض مخصص،
تأكد من فحص تراكب الرسوم،
-
وأن تكن مستعدًا لإحياء صديقك
وهو طريقةclipRect.
-
حسنًا، عمل رائع!
-
فلنعد إلى كولت ليخبرنا المزيد عن الأداء.