Menyesuaikan CarUiRecyclerView

Halaman ini menjelaskan proses penyesuaian CarUiRecyclerView dan scroll .

Prasyarat

Halaman ini mengasumsikan pengetahuan tentang APK target runtime resource overlay (RRO). Untuk mempelajari lainnya, lihat Menyesuaikan aplikasi.

Tentang CarUiRecyclerView

Jika car_ui_scrollbar_enable ditetapkan ke false dalam bools.xml, CarUiRecyclerView tidak meng-inflate scrollbar. Meskipun begitu, hanya androidx.recyclerview di-inflate dengan gaya yang dapat disesuaikan seperti yang ditentukan di bawah. Jika car_ui_scrollbar_enable ditetapkan ke true, CarUiRecyclerView meng-inflate container dengan scrollbar terinstal yang ada di dalamnya. Nantinya, androidx.recyclerview juga ditambahkan dalam container.

CarUiRecyclerView dapat mengambil adaptor apa pun untuk menampilkan data. Tapi yang direkomendasikan adalah gunakan CarUiListItemAdapter saat lib sasis menentukan untuk listItems sehingga bisa disesuaikan oleh OEM. Penyesuaian untuk ListItems ditentukan di Penyesuaian opsi untuk CarUiListItem.

Secara default, car_ui_scrollbar_margin digunakan sebagai lebar tampilan scrollbar. Margin ini juga ditambahkan sebagai android:endMargin dari CarUiRecyclerView sehingga ada margin yang sama di awal dan akhir data. Jika pengembang telah menggunakan enableDivider=true maka OEM dapat mengontrol tampilan pemisah. Dimensi yang dapat disesuaikan untuk CarUiRecyclerView adalah:

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

Bilah gulir

File tata letak untuk scrollbar CarUiRV ditentukan di dalam car_ui_recyclerview_scrollbar.xml. Secara total, keempat pandangan ini yang ditentukan dalam tampilan:

View
Car_ui_scrollbar_page_up Mendefinisikan tombol atas pada scrollbar.
Car_ui_scrollbar_page_down mendefinisikan tombol bawah dari scrollbar.
Car_ui_scrollbar_thumb Tinggi dihitung secara dinamis bergantung pada jumlah item daftar dalam Recycler View (RV).
Car_ui_scrollbar_track Tinggi total yang menentukan batas tempat ibu jari akan bergerak.

OEM harus menempatkan file tata letak ini untuk menyesuaikan scrollbar. Tampilan jalur seharusnya ditempatkan dengan hati-hati karena akan menentukan batas ke mana ibu jari akan bergerak. Tinggi jempol dihitung secara dinamis berdasarkan item daftar di RV dan tingginya dari pemangku kepentingan.

Tata letak ini disertakan dalam penampung CarUiRV car_ui_recycler_view.xml hanya jika car_ui_scrollbar_enable adalah true.

Dimensi lain yang dapat disesuaikan untuk scrollbar adalah:

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

Contoh

Misalnya, untuk menyatukan panah Atas dan Bawah di bagian bawah layar:

  1. Overlay 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. Untuk menentukan resource yang akan di-overlay oleh RRO, tambahkan 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. Jika drawable Atas, Bawah, atau thumb harus diperbarui, mereka juga harus dihamparkan.
  4. Jika ada sumber daya baru yang digunakan dalam paket RRO yang belum ada, maka sumber daya ini juga harus didefinisikan dalam RRO APK yang Anda buat.