التنقّل على التلفزيون

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

المبادئ

الهدف هو أن يبدو التنقل طبيعيًا ومألوفًا دون السيطرة على واجهة المستخدم أو تحويل الانتباه عن المحتوى. تساعد المبادئ التالية في وضع أساس لتجربة مستخدم متسقة وسهلة عبر تطبيقات التلفزيون.

فعّالة

اجعل الوصول إلى المحتوى سريعًا وسهلاً. يريد المستخدمون الوصول إلى المحتوى بسرعة، باستخدام أقل عدد ممكن من النقرات. نظِّم معلوماتك بطريقة تتطلّب أقل عدد من الشاشات.

يمكن توقّعها

اتّبِع أفضل الممارسات والاقتراحات لتسهيل التنقّل للمستخدمين. ويجب عدم إعادة ابتكار أنماط التنقّل بدون داعٍ، لأنّ ذلك يؤدي إلى الالتباس وعدم القدرة على توقّع النتائج.

سهلة الاستخدام

اجعل التنقّل بسيطًا بما فيه الكفاية ليتوافق بسلاسة مع سلوكيات المستخدم المعتمدة على نطاق واسع. تجنب الإفراط في التعقيد من خلال إضافة طبقات غير ضرورية من التنقل.

وحدات التحكم

تتوفر وحدات التحكم بأنماط متنوعة، بدءًا من وحدات التحكم عن بُعد البسيطة وحتى وحدات التحكم المعقّدة في الألعاب. وتشمل جميع وحدات التحكم لوحة توجيه (لوحة التحكم) بالإضافة إلى أزرار اختيار والشاشة الرئيسية ورجوع. تختلف الأزرار الأخرى حسب الطراز.

نموذج عن بُعد
الشكل 1: مثال على جهاز التحكّم بالتلفزيون عن بُعد

لوحة التحكّم
تتوفّر طريقة تنقّل أساسية على التلفزيون من خلال لوحة التحكّم التي تتضمّن أزرار الأجهزة الموجّهة للأعلى وللأسفل ولليسار ولليمين. وتنقل لوحة التحكم التركيز من كائن إلى أقرب كائن في اتجاه الزر الذي يتم الضغط عليه.

زر الاختيار
لاختيار العنصر الذي يتم التركيز عليه على الشاشة.

زر الشاشة الرئيسية
نقل المستخدم إلى الشاشة الرئيسية للنظام.

زر الرجوع
يتيح هذا الخيار للمستخدمين إمكانية الرجوع إلى العرض السابق.

زر الميكروفون
يستدعي إما "مساعد Google" أو الإدخال الصوتي.

التنقّل في "لوحة التحكّم"

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

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

اتبع هذه الإرشادات لاختبار ما إذا كان نظام التنقل في تطبيقك يعمل جيدًا مع لوحة التحكم في جهاز التلفزيون:

  • يُرجى التأكّد من أنّ المستخدم الذي لديه وحدة تحكّم في لوحة التحكّم يمكنه الانتقال إلى جميع عناصر التحكّم الظاهرة على الشاشة.
  • بالنسبة إلى القوائم التي يتم التركيز عليها، تأكّد من أنّ زرَّي "لوحة التحكّم" للأعلى وللأسفل يمرِّران القائمة وأنّ زر الاختيار يحدِّد عنصرًا في القائمة. تأكَّد من أنّه يمكن للمستخدمين اختيار عنصر في القائمة وأنّ القائمة تستمر في التمرير عند اختيار أحد العناصر.
  • تأكَّد من أنّ التبديل بين عناصر التحكّم واضح ويمكن التنبؤ به.

تعديل التنقّل الاتجاهي

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

يوضّح نموذج الرمز البرمجي التالي كيفية تحديد عنصر التحكّم التالي للتركيز على عنصر تنسيق TextView:

<TextView android:id="@+id/Category1" android:nextFocusDown="@+id/Category2" />

يسرد الجدول التالي جميع سمات التنقل المتاحة لأدوات واجهة مستخدم Android:

السمة الوظيفة
nextFocusDown تحدِّد العرض التالي للتركيز عليه عندما ينتقل المستخدم للأسفل.
nextFocusLeft تحدِّد العرض التالي للتركيز عليه عندما ينتقل المستخدم إلى اليسار.
nextFocusRight تحدِّد طريقة العرض التالية للتركيز عليها عندما ينتقل المستخدم إلى اليمين.
nextFocusUp تحدِّد العرض التالي للتركيز عليه عندما ينتقل المستخدم للأعلى.

لاستخدام إحدى سمات التنقل الواضحة هذه، اضبط القيمة على android:id لأداة أخرى في التنسيق. تأكَّد من إعداد ترتيب التنقل كحلقة، بحيث يوجّه عنصر التحكم الأخير التركيز مرة أخرى إلى العنصر الأول.

تقديم تركيز واختيار واضح

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

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

يوفّر Android موارد قائمة الحالة القابلة للرسم لتنفيذ العناصر المميّزة لعناصر التحكّم المحدَّدة والمحدّدة. يوضح مثال الرمز البرمجي التالي كيفية تفعيل السلوك المرئي لأحد الأزرار للإشارة إلى أن المستخدم انتقل إلى عنصر التحكم ثم اختاره:

<!-- res/drawable/button.xml -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true"
          android:drawable="@drawable/button_pressed" /> <!-- pressed -->
    <item android:state_focused="true"
          android:drawable="@drawable/button_focused" /> <!-- focused -->
    <item android:state_hovered="true"
          android:drawable="@drawable/button_focused" /> <!-- hovered -->
    <item android:drawable="@drawable/button_normal" /> <!-- default -->
</selector>

يطبّق رمز XML للتنسيق التالي قائمة الحالات السابقة القابلة للرسم على Button:

<Button
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:background="@drawable/button" />

تأكد من توفير مساحة متروكة كافية داخل عناصر التحكم القابلة للتركيز والقابلة للاختيار حتى تكون العناصر البارزة من حولها مرئية بوضوح.

التنقل باستخدام زر الرجوع

لتحقيق الاتساق بين جميع التطبيقات على النظام الأساسي، تأكَّد من أنّ سلوك زر الرجوع يتّبع هذه الإرشادات.

استخدام سلوك زر الرجوع المتوقع

لإنشاء تجربة تنقّل سهلة ويمكن توقّعها، عندما يضغط المستخدم على زر الرجوع في جهاز التحكّم عن بُعد، انقله إلى الوجهة السابقة.

عند استخدام شريط التنقّل العلوي
صورة تصف تدفق التنقل عند استخدام شريط التنقل العلوي
عند استخدام شريط التنقّل الأيمن
صورة تصف تدفق التنقل عند استخدام شريط التنقل الأيسر

إذا انتقل المستخدم من عنصر في القائمة إلى بطاقة في منتصف الصفحة ثم يضغط على زر الرجوع، تعتمد النتيجة على ما إذا كان التطبيق يستخدم شريط التنقّل العلوي أو شريط التنقّل الأيمن:

  • استخدام التطبيق للتنقل العلوي: يمكنك إعادة المستخدم إلى أعلى الصفحة من خلال التمرير السريع وتنشيط التركيز على القائمة.
  • يستخدم التطبيق شريط التنقّل الأيمن: يمكنك تفعيل القائمة الجانبية اليمنى والتركيز على عنصر القائمة النشط حاليًا.

تأكد من أن زر الرجوع غير محاط بشاشات تأكيد أو جزء من حلقة لانهائية.

لقطة شاشة تعرض مربّع حوار يسأل المستخدم ما إذا كان يريد الخروج

لا تفعل.
تجنَّب استخدام بوابة المخارج. السماح للمستخدمين بالخروج من التطبيق بدون تأكيد


لقطة شاشة تعرض تكرار التنقل

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

عدم عرض زرَّي الرجوع أو الرجوع

على عكس الأجهزة المحمولة باليد، يُستخدم زر الرجوع في جهاز التحكم عن بُعد للانتقال للخلف على التلفزيون. ليس من الضروري إظهار زر الرجوع الافتراضي على الشاشة:

لقطة شاشة تعرض زر الرجوع على الشاشة

لا تفعل.

إظهار زر الإلغاء إذا لزم الأمر

إذا كانت الإجراءات المرئية الوحيدة هي تأكيد إجراءات الشراء أو محوها أو تأكيدها، من الممارسات الجيدة أن يظهر لك الزر إلغاء الذي يعود إلى الوجهة السابقة:

لقطة شاشة تعرض زر إلغاء أوّلي على الشاشة

الإجراءات المقترَحة:

تنفيذ ميزة الرجوع إلى الصفحة السابقة

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

إنّ ComponentActivity، الفئة الأساسية لـ FragmentActivity وAppCompatActivity، تتيح لك التحكّم في سلوك زر الرجوع من خلال استخدام OnBackPressedDispatcher، والذي يمكنك استرداده من خلال استدعاء getOnBackPressedDispatcher().

لمزيد من المعلومات، يُرجى الاطّلاع على توفير ميزة مخصّصة للرجوع إلى الصفحة السابقة.

عناصر التحكّم في التشغيل على التلفزيون

تشغيل الفيديو هو إحدى أهم الميزات على التلفزيون. من المهم أن تعمل مشغّلات الفيديو في التطبيقات على Android TV بالطريقة نفسها راجِع إرشادات عناصر التحكّم في التشغيل للتلفزيون.

التنقّل باستخدام علامة تبويب "البث المباشر"

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

تشغيل المحتوى بسلاسة

ينطبق التشغيل السلس على السلوك داخل التطبيق بعد أي رابط مباشر أو خطي لصفحة في التطبيق من Google TV وAndroid TV.

بالنسبة إلى المستخدمين الذين ينقرون على رابط لصفحة في التطبيق ضمن قناة بث مباشر أو خطي من Google TV وAndroid TV، يجب توجيههم مباشرةً إلى تشغيل القناة بدون أي ظهور أو تأخير في الشاشات التي تظهر على التطبيق المستهدف. لا يُسمح بعمليات تسجيل الدخول ومسارات الاشتراك والفيديوهات التي تتضمّن العلامة التجارية وحالات التأخير الأخرى.

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

بالإضافة إلى ذلك، إذا كان الوصول إلى القناة المرتبطة بصفحات في التطبيق يستغرق بضع ثوانٍ، يُسمح بعرض العلامة التجارية للقناة و/أو الخدمة. في المقابل، يجب أن تكون المدة المطلوبة فقط للمدة التي يستغرقها تحميل القناة (وأن تكون مدة هذه المدة مماثلة لمتوسط وقت تحميل القناة داخل التطبيق).

إذا لم يكن المستخدم قد سجّل الخروج من حسابه أو لم يكن مشتركًا، يمكنك حظر تشغيل قناة مدفوعة لإكمال عملية تسجيل الدخول أو الاشتراك.

ردّ مباشر

عندما يشغّل المستخدمون تطبيقًا من رابط لموضع معيّن في علامة التبويب "بث مباشر"، ثم يضغطون على زر الرجوع، يجب العودة إلى علامة التبويب "البثّ المباشر" بضغطة واحدة في الخلف، بغض النظر عن مقدار الوقت المنقضي. يجب اتّباع سلوك الرجوع المباشر هذا في كل الروابط المؤدية إلى صفحات في علامة التبويب "البث المباشر" على Google TV وAndroid TV.

يتم تمييز الروابط لصفحات في التطبيق في علامة التبويب "البث المباشر" من خلال مَعلمة رابط لصفحة معيّنة في التطبيق: ?exit_on_back=[true|false]. يجب أن تحلِّل التطبيقات هذه المعلَمة لتحديد ما إذا تم تشغيل التطبيق من علامة التبويب "البث المباشر" أم لا. وإذا كانت قيمة السمة exit_on_back هي true، يجب أن تنفِّذ التطبيقات سلوك الرجوع المباشر.

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

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

إنّ الضغط المتكرر على زر الرجوع يجب أن يوجِّه المستخدم إلى جذر التطبيق ثم يعود إلى Google TV أو Android TV بدون أي تكرارات لانهائية. لمزيد من المعلومات، اطّلِع على قسم سلوك زر الرجوع المتوقّع.

وجهة بدء ثابتة

الشاشة الأولى التي يراها المستخدم عند تشغيل التطبيق من مشغّل التطبيقات هي أيضًا الشاشة الأخيرة التي يراها المستخدم عند العودة إلى مشغّل التطبيقات بعد الضغط على زر الرجوع.

يحاكي الربط بصفحة معيّنة التنقّل اليدوي.

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

لقطات شاشة تعرض رابطًا لصفحة في التطبيق في صفحة تفاصيل داخل تطبيق. يؤدي الضغط على زر الرجوع إلى الانتقال إلى الشاشة الرئيسية للتطبيق والضغط مجددًا على زر الرجوع إلى الشاشة الأصلية.

يحاكي الربط بصفحة معيّنة في تطبيق من تطبيق آخر التنقل اليدوي. على سبيل المثال، إذا انتقل المستخدم مباشرةً إلى صفحة التفاصيل على تطبيق Moviestar من Google TV، ثم ضغط على زر الرجوع، سيتم نقله إلى الصفحة الرئيسية لتطبيق Moviestar.

محو المسار لجميع العناصر التي يمكن التركيز عليها

اسمح للمستخدمين بالتنقل في واجهة المستخدم مع اتجاه واضح. إذا لم يكن هناك مسار مستقيم للوصول إلى عنصر التحكم، ففكر في نقله.

مثال يمكن التركيز على التنقل

الإجراءات المقترَحة:
عناصر التحكّم في الأماكن، مثل إجراء البحث المعروض هنا، في مواقع لا تتداخل مع عناصر أخرى قابلة للنقر

مثال يمكن التركيز على التنقل

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

المحوران في الرسم البياني

صمم التخطيط الخاص بك للاستفادة من كل من المحاور الأفقية والرأسية. امنح كل اتجاه دالة محددة، مما يجعل التنقل في التسلسلات الهرمية الكبيرة بسرعة.

مثال على محاور التنقل

افعل.
يمكن اجتياز الفئات على المحور الرأسي، ويمكن تصفّح العناصر ضمن كل فئة على المحور الأفقي.

مثال على محاور التنقل

لا تفعل.
تجنَّب التدرّج الهرمي للتنسيقات المركّبة والمدمجة.