تخصيص CarUiRecyclerView

توضّح هذه الصفحة عملية تخصيصCarUiRecyclerView وشريط التمرير.

المتطلّبات الأساسية

تفترض هذه الصفحة معرفة حزمة APK المستهدَفة لتطبيق "تداخل الموارد أثناء التشغيل" (RRO). لمزيد من المعلومات، يُرجى الاطّلاع على مقالة تخصيص التطبيقات.

لمحة عن CarUiRecyclerView

عند ضبط car_ui_scrollbar_enable على false في bools.xml، لا يضخّم CarUiRecyclerView شريط التمرير. ومع ذلك، يتم تضخيم العلامة androidx.recyclerview فقط باستخدام الأنماط القابلة للتخصيص كما هو موضّح أدناه. عند ضبط car_ui_scrollbar_enable على true، يضخّم CarUiRecyclerView الحاوية التي تم تثبيت شريط التمرير فيها داخلها. في وقت لاحق، تتم أيضًا إضافة androidx.recyclerview داخل الحاوية نفسها.

يمكن لـ CarUiRecyclerView استخدام أي محوِّل لعرض البيانات. ولكن يُنصح باستخدام CarUiListItemAdapter حيث تحدِّد مكتبة الشاسيه CarUiListItemAdapter تنسيق listItems، وبالتالي يمكن لمصنّعي المعدّات الأصلية تخصيصها. يتم تحديد تخصيص ListItems في خيارات تخصيص CarUiListItem.

يتم استخدام car_ui_scrollbar_margin تلقائيًا كعرض عرض شريط التمرير. تتم أيضًا إضافة هذا الهامش كandroid:endMargin من CarUiRecyclerView حتى يكون هناك هامش متساوٍ في بداية البيانات ونهايتها. إذا استخدم المطوِّر enableDivider=true، يمكن لمصنّع المعدّات الأصلية التحكّم في كيفية ظهور الفواصل. في ما يلي السمات التي يمكن تعديلها في CarUiRecyclerView:

  <dimen name="car_ui_recyclerview_divider_height">0dp</dimen>
  <dimen name="car_ui_recyclerview_divider_start_margin">0dp</dimen>
  <dimen name="car_ui_recyclerview_divider_end_margin">0dp</dimen>
  <dimen name="car_ui_recyclerview_divider_top_margin">0dp</dimen>
  <dimen name="car_ui_recyclerview_divider_bottom_margin">0dp</dimen>

شريط التمرير

يتم تحديد ملف التنسيق الخاص بشريط التمرير CarUiRV في car_ui_recyclerview_scrollbar.xml. في المجمل، يتم تحديد هذه المشاهدات الأربعة ضمن العرض:

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

يتم تضمين هذا التنسيق في حاوية CarUiRV car_ui_recycler_view.xml فقط إذا كان car_ui_scrollbar_enable true.

في ما يلي السمات الأخرى التي يمكن تعديلها في شريط التمرير:

  <dimen name="car_ui_scrollbar_container_width">@dimen/car_ui_margin</dimen>
  <dimen name="car_ui_scrollbar_button_size">@dimen/car_ui_touch_target_width</dimen>
  <dimen name="car_ui_scrollbar_thumb_width">7dp</dimen>
  <dimen name="car_ui_scrollbar_separator_margin">16dp</dimen>
  <dimen name="car_ui_scrollbar_margin">@dimen/car_ui_margin</dimen>
  <dimen name="car_ui_scrollbar_thumb_radius">100dp</dimen>

  <item name="car_ui_button_disabled_alpha" format="float" type="dimen">0.2</item>
  <item name="car_ui_scrollbar_milliseconds_per_inch" format="float" type="dimen">150.0</item>
  <item name="car_ui_scrollbar_deceleration_times_divisor" format="float" type="dimen">0.45</item>
  <item name="car_ui_scrollbar_decelerate_interpolator_factor" format="float" type="dimen">1.8</item>

  <dimen name="car_ui_scrollbar_padding_start">0dp</dimen>
  <dimen name="car_ui_scrollbar_padding_end">0dp</dimen>

مثال

على سبيل المثال، لنقل كلا السَهمَين المتّجهَين للأعلى وللأسفل معًا إلى أسفل الشاشة:

1. الإعلانات التي تظهر على سطح الفيديو car_ui_recyclerview_scrollbar.xml:

   <?xml version="1.0" encoding="utf-8"?>
   <RelativeLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="@dimen/car_ui_margin"
       android:layout_height="match_parent"
       android:id="@+id/car_ui_scroll_bar">
   
       <!-- View height is dynamically calculated during layout. -->
       <View
           android:id="@+id/car_ui_scrollbar_thumb"
           android:layout_width="7dp"
           android:layout_height="20dp"
           android:layout_alignParentTop="true"
           android:layout_centerHorizontal="true"
           android:background="@drawable/car_ui_recyclerview_scrollbar_thumb"/>
   
       <View
           android:id="@+id/car_ui_scrollbar_track"
           android:layout_width="10dp"
           android:layout_height="match_parent"
           android:layout_marginTop="10dp"
           android:layout_centerHorizontal="true"
           android:layout_above="@+id/car_ui_scrollbar_page_up"/>
   
       <ImageView
           android:id="@+id/car_ui_scrollbar_page_up"
           android:layout_width="76dp"
           android:layout_height="76dp"
           android:focusable="false"
           android:hapticFeedbackEnabled="false"
           android:src="@drawable/car_ui_recyclerview_ic_up"
           android:scaleType="centerInside"
           android:layout_centerHorizontal="true"
           android:layout_above="@+id/car_ui_scrollbar_page_down"/>
   
       <ImageView
           android:id="@+id/car_ui_scrollbar_page_down"
           android:layout_width="76dp"
           android:layout_height="76dp"
           android:focusable="false"
           android:hapticFeedbackEnabled="false"
           android:src="@drawable/car_ui_recyclerview_ic_down"
           android:scaleType="centerInside"
           android:layout_centerHorizontal="true"
         android:layout_alignParentBottom="true"/>
   </RelativeLayout>

2. لتحديد الموارد التي سيتمّ وضعها فوقها من خلال ميزة "الإعلانات أثناء التشغيل"، أضِف Overlays.xml:

   <overlay>
       <item target="id/car_ui_scroll_bar" value="@id/car_ui_scroll_bar"/>
       <item target="id/car_ui_scrollbar_thumb" value="@id/car_ui_scrollbar_thumb"/>
       <item target="id/car_ui_scrollbar_track" value="@id/car_ui_scrollbar_track"/>
       <item target="id/car_ui_scrollbar_page_up" value="@id/car_ui_scrollbar_page_up"/>
       <item target="id/car_ui_scrollbar_page_down" value="@id/car_ui_scrollbar_page_down"/>
       <item target="layout/car_ui_recyclerview_scrollbar" value="@layout/car_ui_recyclerview_scrollbar"/>
   </overlay>

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