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

إنشاء تطبيقات أفضل باستخدام Compose

يمكنك إنشاء واجهات مستخدم جميلة باستخدام الحد الأدنى من الرموز البرمجية باستخدام Jetpack Compose لنظام التشغيل Android TV.

Compose for TV →

تحذير: تم إيقاف مكتبة Leanback. يُرجى استخدام Jetpack Compose لنظام التشغيل Android TV بدلاً منها.

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

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

مكتبة Leanback Paging

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

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

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 Tabs.

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

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. يمكنك أيضًا استخدام مظهر الجسر لمجموعة أدوات واجهة مستخدم Leanback.

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

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

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