Sesuaikan CarUiRecyclerView

Halaman ini menjelaskan proses penyesuaian CarUiRecyclerView dan bilah gulir.

Prasyarat

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

Tentang CarUiRecyclerView

Ketika car_ui_scrollbar_enable disetel ke false di bools.xml , CarUiRecyclerView tidak mengembangkan scrollbar. Meskipun demikian, hanya androidx.recyclerview yang dilengkapi dengan gaya yang dapat disesuaikan seperti yang ditentukan di bawah. Ketika car_ui_scrollbar_enable disetel ke true , CarUiRecyclerView akan mengembangkan kontainer dengan scrollbar terpasang di dalamnya. Nanti androidx.recyclerview juga ditambahkan dalam wadah yang sama.

CarUiRecyclerView dapat menggunakan adaptor apa pun untuk menampilkan data. Namun rekomendasinya adalah menggunakan CarUiListItemAdapter di mana lib sasis mendefinisikan tata letak untuk listItems dan karenanya dapat disesuaikan oleh OEM. Penyesuaian untuk ListItems ditentukan dalam Opsi penyesuaian untuk CarUiListItem .

Secara default, car_ui_scrollbar_margin digunakan sebagai lebar tampilan scrollbar. Margin ini juga ditambahkan sebagai android:endMargin dari CarUiRecyclerView sehingga terdapat margin yang sama di awal dan akhir data. Jika pengembang telah menggunakan enableDivider=true maka OEM dapat mengontrol bagaimana pembagi akan muncul. 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>

Scroll bar

File tata letak untuk scrollbar CarUiRV ditentukan di car_ui_recyclerview_scrollbar.xml . Secara total, empat tampilan ini didefinisikan dalam tampilan:

Tampilan
Car_ui_scrollbar_page_up Mendefinisikan tombol atas pada scrollbar.
Car_ui_scrollbar_page_down mendefinisikan tombol bawah pada scrollbar.
Car_ui_scrollbar_thumb Tinggi dihitung secara dinamis bergantung pada jumlah item daftar di Recycler View (RV).
Car_ui_scrollbar_track Tinggi total yang menentukan batas gerak ibu jari.

OEM harus melapisi file tata letak ini untuk menyesuaikan bilah gulir. Tampilan lintasan harus ditempatkan dengan hati-hati karena hal itu akan menentukan batas pergerakan ibu jari. Tinggi jempol dihitung secara dinamis berdasarkan item daftar di RV dan tinggi penonton.

Tata letak ini disertakan dalam wadah 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. Hamparan 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 sumber daya 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 gambar Atas, Bawah, atau jempol harus diperbarui, gambar tersebut juga harus dilapis.
  4. Jika ada sumber daya baru yang digunakan dalam paket RRO yang belum ada, sumber daya ini juga harus ditentukan dalam APK RRO yang Anda buat.