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

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

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

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

مكتبة الصفحات في Leanback

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

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

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

ثم اتبع مستندات الصفحة 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

توفر قوالب مجموعة أدوات واجهة مستخدم 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 على قيود في المظاهر التي تتوافق معها وكيفية التركيز الحركات.

المظاهر المتوافقة

المظاهر المشتقة من Theme.AppCompat هي فقط المتوافقة. TabLayout يحتوي على قيد تنفيذ موضوع، ما يمنع أي موضوع غير تابع من استخدام Theme.AppCompat. يمكنك أيضًا استخدام مظهر الجسر مجموعة أدوات واجهة مستخدم Leanback.

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

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

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