مكتبات أدوات واجهة المستخدم في Leanback

إنشاء تطبيقات أفضل باستخدام Compose
يمكنك إنشاء واجهات مستخدم رائعة بأقل قدر من الرموز البرمجية باستخدام Jetpack Compose لنظام التشغيل Android TV.

توفر مجموعة أدوات واجهة مستخدم Leanback المتوقّفة بعض المكتبات الخاصة بالتلفزيون والتي تقتصر على التطبيقات المطوَّرة لنظام التشغيل Android TV. وتتضمّن هذه المكتبات ما يلي:

  • مكتبة Leanback: توفّر نماذج لواجهة المستخدم تسهّل إنشاء تطبيقات Android TV.
  • توفر مكتبة Leanback Preferences شاشات الإعدادات والتفضيلات التي تتوافق مع النظام الأساسي ولكن يمكن تخصيصها لتتطابق مع تطبيقك.
  • مكتبة Leanback Paging: تتوافق مع نموذج التقسيم إلى صفحات AndroidX الخاص بـ ObjectAdapters، والذي يُستخدم عادةً مع نماذج Leanback.
  • مكتبة علامات التبويب Leanback: تتيح التنقّل باستخدام علامات التبويب على Android TV.

Leanback paging library

تعمل ميزة التقسيم إلى صفحات داخل مجموعة أدوات واجهة مستخدم Leanback بالطريقة نفسها التي تعمل بها مكتبة Paging 3 من AndroidX، ما يسهّل إضافة ميزة التقسيم إلى صفحات إلى RecyclerView.Adapter. باستخدام مكتبة Leanback Paging، يكون المحوّل المعروض عادةً ObjectAdapter بدلاً من ذلك، وبالتالي تضيف المكتبة إمكانية تقسيم المحتوى إلى صفحات إلى ObjectAdapter.

لإضافة محوّل صفحات إلى تطبيقك، عليك أولاً إضافة عنصر المكتبة التابع إلى مشروعك:

implementation "androidx.leanback:leanback-paging:$version"

بعد ذلك، اتّبِع مستندات Paging 3 باستخدام androidx.leanback.paging.PagingDataAdapter بدلاً من androidx.paging.PagingDataAdapter. الفرق الوحيد هو أنّه يمكنك الآن إدخال Presenter أو PresenterSelector. يعمل هذا الاختصار في أيّ مكان يمكنك فيه عادةً استخدام ObjectAdapter، مثل ListRow:

Kotlin

val adapter: PagingDataAdapter<MyItem> = PagingDataAdapter(myPresenter,
   object : DiffUtil.ItemCallback<MyItem>() {
       override fun areItemsTheSame(
           oldItem: MyItem,
           newItem: MyItem
       ): Boolean {
           return oldItem.id === newItem.id
       }

       override fun areContentsTheSame(
           oldItem: MyItem,
           newItem: MyItem
       ): Boolean {
           return oldItem == newItem
       }
   })

val header = HeaderItem(headerTitle)
val row = ListRow(header, adapter)

Java

PagingDataAdapter<MyItem> adapter = new PagingDataAdapter(myPresenter, new DiffUtil.ItemCallback<MyItem>() {
    @Override
    public boolean areItemsTheSame(@NonNull MyItem oldItem, @NonNull MyItem newItem) {
        return oldItem.getId().equals(newItem.getId());
    }

    @Override
    public boolean areContentsTheSame(@NonNull MyItem oldItem, @NonNull MyItem newItem) {
        return oldItem.equals(newItem);
    }
});

HeaderItem header = new HeaderItem(headerTitle);
Row row = new ListRow(header, adapter);

مكتبة Leanback Tabs

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

أضِف تبعية المكتبة إلى مشروعك:

implementation "androidx.leanback:leanback-tab:$version"

بعد ذلك، نفِّذ علامات التبويب باستخدام LeanbackTabLayout وLeanbackViewPager باتّباع دليل ViewPager الحالي. يُرجى العِلم أنّ LeanbackViewPager يستند إلى ViewPager وليس إلى ViewPager2.

في ما يلي مثال:

Kotlin

val leanbackTabLayout = findViewById<LeanbackTabLayout>(R.id.tab_layout)
val leanbackViewPager = findViewById<LeanbackViewPager>(R.id.view_pager)

leanbackViewPager.setAdapter(adapter)
leanbackTabLayout.setupWithViewPager(leanbackViewPager)

Java

LeanbackTabLayout leanbackTabLayout = findViewById(R.id.tab_layout);
LeanbackViewPager leanbackViewPager = findViewById(R.id.view_pager);

leanbackViewPager.setAdapter(adapter);
leanbackTabLayout.setupWithViewPager(leanbackViewPager);

القيود

تتضمّن مكتبة Leanback Tabs قيودًا على السمات التي تتوافق معها وطريقة التعامل مع حركة التركيز.

المواضيع المتوافقة

لا تتوفّر إلا السمات المستندة إلى Theme.AppCompat. تحتوي TabLayout على قيد فرض سمة، ما يمنع استخدام أي سمة غير فرعية من Theme.AppCompat. يمكنك أيضًا استخدام مظهر Bridge لمجموعة أدوات Leanback UI.

نقل التركيز من علامات التبويب إلى أعلى الصفحة

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

الشكل 1. ينقل الزرّ العلوي في لوحة التحكّم التركيز إلى علامة التبويب بدلاً من العنصر السابق.