# قم بعرض كل قيمة HUD من حالة اللعبة الرسمية

> حافظ على اتساق النتائج والأرواح والمؤقتات من خلال التعامل مع حالة اللعبة كمصدر للحقيقة وتقديم قيم شاشة عرض المعلومات (HUD) من مسار تحديث واحد.

- URL: https://oneshotgems.ai/ar/topics/synchronizing-game-hud
- الفئة: لمطوري الألعاب
- النوع: دليل
- آخر تحديث: 5 أكتوبر 2026

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

## تحديث الحالة مرة واحدة، اشتقاق العرض

عندما يتم جمع عملة معدنية، قم بتحديث model.score في حدث اللعبة أو خطوة المحاكاة. عند نقطة تحديث واجهة المستخدم، اعرض القيمة المعروضة من model.score بدلاً من إضافة قيمة منفصلة إلى التسمية. بالنسبة إلى DOM HUD، قم بتحديث textContent عندما تتغير القيمة؛ بالنسبة للوحة HUD القماشية، ارسم الرقم من نفس حقل النموذج. يمكن أن يتحرك العد المرئي نحو النتيجة المسجلة.

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

## اختبار التحديثات السريعة والحالات النهائية

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

## قلّل تحديثات العرض غير الضرورية

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

## أسئلة

**هل يجب تحديث علامة النتيجة داخل معالج التصادم؟** يمكن للمعالج تحديث حالة النتيجة المعتمدة؛ دع مسار عرض واحدًا ينسّق هذه الحالة ويعرضها. تجنّب الاحتفاظ في التسمية بنتيجة ثانية تزداد بصورة مستقلة.

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

## اتبع فضولك

- [صمّم استجابات للعبة تشرح كل فعل](https://oneshotgems.ai/ar/topics/game-feedback-design): اجعل استجابات اللعبة توضح ما تغيّر ولماذا وما يمكن للاعب فعله بعده، دون حجب مساحة اللعب.
- [أنشئ حلقة ألعاب موثوقة في المتصفح](https://oneshotgems.ai/ar/topics/browser-game-loop): قم ببناء تحديثات لعبة المتصفح والرسم حول إطارات الرسوم المتحركة دون ربط سرعة المحاكاة بمعدل تحديث شاشة اللاعب.

## للمزيد من القراءة

- [طلب MDNAnimationFrame](https://developer.mozilla.org/en-US/docs/Web/API/Window/requestAnimationFrame)

---
الصفحة الأساسية: https://oneshotgems.ai/ar/topics/synchronizing-game-hud