Tuỳ chỉnh CarUiRecyclerView

Trang này mô tả quy trình tuỳ chỉnh CarUiRecyclerView và thao tác cuộn thanh.

Điều kiện tiên quyết

Trang này giả định rằng bạn đã biết về một APK mục tiêu lớp phủ tài nguyên thời gian chạy (RRO). Để tìm hiểu khác, hãy xem phần Tuỳ chỉnh ứng dụng.

Giới thiệu về CarUiRecyclerView

Khi bạn đặt car_ui_scrollbar_enable thành false trong bools.xml, CarUiRecyclerView không tăng cường thanh cuộn. Tuy nhiên, chỉ có androidx.recyclerview được tăng cường với các kiểu có thể tuỳ chỉnh như xác định dưới đây. Khi bạn đặt car_ui_scrollbar_enable thành true, CarUiRecyclerView tăng cường vùng chứa bằng thanh cuộn đã cài đặt bên trong đó. Sau này, androidx.recyclerview cũng được thêm vào trong cùng một vùng chứa.

CarUiRecyclerView có thể dùng bất kỳ trình chuyển đổi nào để hiển thị dữ liệu. Tuy nhiên, đề xuất là sử dụng CarUiListItemAdapter, trong đó lib khung gầm xác định bố cục cho listItems và do đó có thể được OEM tuỳ chỉnh. Tuỳ chỉnh cho ListItems được định nghĩa trong Tuỳ chỉnh cho CarUiListItem.

Theo mặc định, car_ui_scrollbar_margin được sử dụng làm chiều rộng của khung hiển thị thanh cuộn. Lề này cũng được thêm vào dưới dạng android:endMargin của CarUiRecyclerView, vì vậy, có biên lợi nhuận bằng nhau ở đầu và cuối của dữ liệu. Nếu nhà phát triển đã sử dụng enableDivider=true thì OEM có thể kiểm soát cách xuất hiện của đường phân chia. Bạn có thể điều chỉnh các phương diện cho CarUiRecyclerView là:

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

Thanh cuộn

Tệp bố cục cho thanh cuộn CarUiRV được xác định trong car_ui_recyclerview_scrollbar.xml Tổng cộng, bốn lượt xem này được xác định trong khung hiển thị:

Số lượt xem
Car_ui_scrollbar_page_up Xác định nút lên của thanh cuộn.
Car_ui_scrollbar_page_down xác định nút xuống của thanh cuộn.
Car_ui_scrollbar_thumb Chiều cao được tính toán linh động tuỳ thuộc vào số lượng mục trong danh sách trong Chế độ xem tái chế (RV).
Car_ui_scrollbar_track Tổng chiều cao xác định các giới hạn mà ngón cái sẽ di chuyển.

OEM nên phủ tệp bố cục này để tuỳ chỉnh thanh cuộn. Chế độ xem bản nhạc phải là được đặt cẩn thận vì việc đó sẽ xác định các giới hạn mà ngón cái sẽ di chuyển. Chiều cao ngón tay cái được tính toán linh động dựa trên các mục trong danh sách trong xe RV và chiều cao của trình xem chủ sở hữu.

Bố cục này có trong vùng chứa CarUiRV car_ui_recycler_view.xml chỉ nếu car_ui_scrollbar_enabletrue.

Các kích thước khác có thể được điều chỉnh cho thanh cuộn là:

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

Ví dụ

Ví dụ: để đưa cả Mũi tên lên và Mũi tên xuống ở cuối màn hình:

  1. Lớp phủ 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. Để xác định các tài nguyên cần phủ RRO, hãy thêm 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. Nếu phải cập nhật một đối tượng có thể vẽ Mũi tên lên, Mũi tên xuống hoặc Ngón tay cái, thì các đối tượng đó cũng phải được phủ lên trên.
  4. Nếu bất kỳ tài nguyên mới nào chưa tồn tại trong gói RRO được sử dụng, thì các tài nguyên này cũng phải được xác định trong APK RRO mà bạn tạo.