تتيح أحداث حركة الجهاز والاتجاه الوصول إلى ميزات مقياس التسارع والجيروسكوب والبوصلة في الأجهزة المحمولة.
ويمكن استخدام هذه الأحداث لأغراض عديدة، في الألعاب، على سبيل المثال، للتحكم اتجاه أو عمل الحرف. وعند استخدامها مع تحديد الموقع الجغرافي، يمكنها في إنشاء اتجاهات مفصّلة أكثر دقة أو توفير معلومات عن موقع محدد.
ملخّص
- اكتشِف الجانب الذي في أعلى الجهاز وكيفية تدوير الجهاز.
- تعرَّف على كيفية الاستجابة لأحداث الحركة والاتجاه ووقت الاستجابة.
أي النهاية انتهى؟
لاستخدام البيانات التي تعرضها أحداث اتجاه الجهاز والحركة، من المهم فهم القيم المقدمة.
إطار إحداثيات الأرض
تتم محاذاة إطار إحداثيات الأرض، الموصوف بالقيم X وY وZ،
يعتمد على الجاذبية والاتجاه المغناطيسي القياسي.
| نظام الإحداثيات | |
|---|---|
X |
يمثل الاتجاه من الشرق إلى الغرب (حيث يكون الشرق موجبًا). |
Y |
يمثل الاتجاه من الشمال إلى الجنوب (حيث يكون الشمال موجبًا). |
Z |
يمثل الاتجاه من أعلى لأسفل سواء كان عموديًا على الأرض (حيث تكون القيمة موجبًا). |
إطار إحداثيات الجهاز
تتم محاذاة إطار إحداثيات الجهاز، الموضَّح بالقيم x وy وz.
بناءً على منتصف الجهاز.
| نظام الإحداثيات | |
|---|---|
X |
في مستوى الشاشة، موجب إلى اليمين. |
Y |
في مستوى الشاشة، بشكل موجب نحو الأعلى. |
Z |
عمودي على الشاشة أو لوحة المفاتيح، توسيع موجب على بُعد. |
على الهاتف أو الجهاز اللوحي، يستند اتجاه الجهاز إلى اتجاه الشاشة. بالنسبة إلى الهواتف والأجهزة اللوحية، يعتمد ذلك على الجهاز في الوضع الرأسي. بالنسبة لأجهزة الكمبيوتر المكتبية أو المحمولة، يكون الاتجاه في ما يتعلق بلوحة المفاتيح.
بيانات التدوير
يتم عرض بيانات الدوران على هيئة زاوية أويلر، تمثّل عدد درجات الفرق بين إحداثيات الجهاز الإطار وإطار إحداثيات الأرض.
إصدار أولي
التدوير حول المحور z. وتكون قيمة alpha تساوي 0° عندما يكون أعلى
يكون الجهاز موجَّهًا إلى الشمال مباشرة. ونظرًا لأن الجهاز يتم تدويره عكس عقارب الساعة،
تزيد قيمة alpha.
إصدار تجريبي
التدوير حول المحور x. وتكون قيمة beta هي 0° عندما يكون الجزء العلوي
الجزء السفلي من الجهاز متساويان عن سطح الأرض. القيمة
عندما يوجه الجزء العلوي من الجهاز نحو سطح الأرض.
غاما
الدوران حول المحور y. تكون قيمة gamma هي 0° عند استخدام الجانب الأيسر
الحواف اليمنى للجهاز متساوية عن سطح الأرض. القيمة
يزداد عند إمالة الجانب الأيمن باتجاه سطح الأرض.
اتجاه الجهاز
يعرض حدث اتجاه الجهاز بيانات التدوير، التي تتضمن مقدار يميل الجهاز من الأمام إلى الوراء، جنبًا إلى جنب، وإذا كان الهاتف أو الكمبيوتر المحمول وجود بوصلة، والاتجاه المواجه للجهاز.
استخدِمها باعتدال.
اختبار الحصول على الدعم
عدم تحديث واجهة المستخدم في كل حدث اتجاه؛ يمكنك بدلاً من ذلك المزامنة مع "requestAnimationFrame".
حالات استخدام أحداث اتجاه الجهاز
هناك العديد من الاستخدامات لأحداث اتجاه الجهاز. وتشمل الأمثلة ما يلي:
- تعديل الخريطة أثناء تحرك المستخدم
- إمكانية إدخال تعديلات دقيقة على واجهة المستخدم، مثل إضافة تأثيرات اختلاف المنظر
- ويمكن استخدامها مع رصد الموقع الجغرافي لتوفير اتجاهات مفصّلة للتنقّل.
البحث عن الدعم والاستماع إلى الأحداث
للاستماع إلى DeviceOrientationEvent، تأكَّد أولاً من أنّ المتصفّح يتيح عرض الأحداث. بعد ذلك، يمكنك إرفاق أداة معالجة حدث بالكائن window الذي يستمع إلى أحداث deviceorientation.
if (window.DeviceOrientationEvent) {
window.addEventListener('deviceorientation', deviceOrientationHandler, false);
document.getElementById('doeSupported').innerText = 'Supported!';
}
التعامل مع أحداث اتجاه الجهاز
يتم تنشيط حدث اتجاه الجهاز عند تحرك الجهاز أو تغييره. توجهك. وترجع بيانات حول الفرق بين الجهاز في وضعه الحالي بالنسبة إطار إحداثيات Earth
يعرض الحدث عادةً ثلاث سمات: alpha
beta وgamma. في Mobile Safari، هناك معلمة إضافية
webkitCompassHeading
بعنوان البوصلة.
حركة الجهاز
يعرض حدث اتجاه الجهاز بيانات التدوير، التي تتضمن مقدار يميل الجهاز من الأمام إلى الوراء، جنبًا إلى جنب، وإذا كان الهاتف أو الكمبيوتر المحمول وجود بوصلة، والاتجاه المواجه للجهاز.
استخدام حركة الجهاز عند الحاجة إلى الحركة الحالية للجهاز
درجة الحرارة تساوي rotationRate درجة مئوية/ثانية.
تبلغ قيمة المقياسَين acceleration وaccelerationWithGravity ملي ثانية2.
انتبِه إلى الاختلافات بين عمليات تنفيذ المتصفِّح.
حالات استخدام أحداث حركة الجهاز
هناك العديد من الاستخدامات لأحداث حركة الجهاز. وتشمل الأمثلة ما يلي:
- إيماءة تحريك الجهاز بسرعة لإعادة تحميل البيانات
- في الألعاب، لكي تقفز أو تتحرك الشخصيات.
- لتطبيقات الصحة واللياقة البدنية
البحث عن الدعم والاستماع إلى الأحداث
للاستماع إلى DeviceMotionEvent، تحقَّق أولاً لمعرفة ما إذا كانت الأحداث
في المتصفح. بعد ذلك، يتم إرفاق أداة معالجة الحدث بالحدث window.
كان هناك عنصر يستمع إلى حدثين (devicemotion).
if (window.DeviceMotionEvent) {
window.addEventListener('devicemotion', deviceMotionHandler);
setTimeout(stopJump, 3 * 1000);
}
التعامل مع أحداث حركة الجهاز
يتم تنشيط حدث حركة الجهاز على فاصل زمني منتظم ويعرض بيانات عن الدوران (بالدرجة/الثانية) والتسارع (م/ثانية2) للجهاز، في تلك اللحظة. بعض الأجهزة لا تحتوي على المعدّات لاستبعاد تأثير الجاذبية.
ويرجع الحدث أربعة خصائص،
accelerationIncludingGravity،
acceleration، والتي تستبعد تأثيرات
الجاذبية، rotationRate وinterval.
على سبيل المثال، لنلقِ نظرة على هاتف موضوع على طاولة على طاولة مسطحة، موجَّهة للأعلى.
| الحالة | الدوران | التسارع (م/ث2) | التسارع مع الجاذبية (م/ث2) |
|---|---|---|---|
| لا يتم نقل | [0، 0، 0] | [0، 0، 0] | [0، 0، 9.8] |
| التحرّك باتجاه السماء | [0، 0، 0] | [0، 0، 5] | [0، 0، 14.81] |
| الانتقال إلى اليمين فقط | [0، 0، 0] | [3، 0، 0] | [3، 0، 9.81] |
| تحريك لأعلى وإلى اليمين | [0، 0، 0] | [5، 0، 5] | [5، 0، 14.81] |
وبالعكس، إذا تم تثبيت الهاتف بحيث كانت الشاشة عمودية وظهرت للمشاهد مباشرةً:
| الحالة | الدوران | التسارع (م/ث2) | التسارع مع الجاذبية (م/ث2) |
|---|---|---|---|
| لا يتم نقل | [0، 0، 0] | [0، 0، 0] | [0، 9.81، 0] |
| التحرّك باتجاه السماء | [0، 0، 0] | [0، 5، 0] | [0، 14.81، 0] |
| الانتقال إلى اليمين فقط | [0، 0، 0] | [3، 0، 0] | [3، 9.81، 0] |
| تحريك لأعلى وإلى اليمين | [0، 0، 0] | [5، 5، 0] | [5، 14.81، 0] |
النموذج: حساب أقصى تسارع لجسم ما
تتمثل إحدى طرق استخدام أحداث حركة الجهاز في حساب الحد الأقصى للتسارع لكائن. على سبيل المثال، ما هي أقصى تسارع لشخص القفز؟
if (evt.acceleration.x > jumpMax.x) {
jumpMax.x = evt.acceleration.x;
}
if (evt.acceleration.y > jumpMax.y) {
jumpMax.y = evt.acceleration.y;
}
if (evt.acceleration.z > jumpMax.z) {
jumpMax.z = evt.acceleration.z;
}
بعد النقر على "انتقال"! يتم إخبار المستخدم بالقفز. خلال ذلك الوقت، أن تقوم الصفحة بتخزين الحد الأقصى (والأدنى) لقيم التسريع، وبعد مباشرة، تخبر المستخدم بأقصى تسريع.