自訂 CarUiRecyclerView

本頁說明自訂CarUiRecyclerView和捲動的過程 。

必要條件

本頁面假定執行階段資源重疊 (RRO) 目標 APK 的知識。學習 請參閱自訂應用程式

關於 CarUiRecyclerView

bools.xml 中的 car_ui_scrollbar_enable 設為 false 時, CarUiRecyclerView 不會加載捲軸。即使如此 androidx.recyclerview 以下列自訂樣式加載。 當 car_ui_scrollbar_enable 設為 true 時, CarUiRecyclerView 會在已安裝捲軸的容器加載容器 在其中建立目錄後來的 androidx.recyclerview 也在相同的資源中新增 都會在 Docker 容器中執行

CarUiRecyclerView 可使用任何轉接器來顯示資料。不過 建議您使用 CarUiListItemAdapter,讓 Chassis lib 定義 可以由原始設備製造商 (OEM) 自訂 listItems 和版面配置的介面。ListItems 自訂項目 都已定義於「自訂 CarUiListItem 的選項

根據預設,系統會使用 car_ui_scrollbar_margin 做為捲軸檢視畫面的寬度。 這個邊界也會新增為 CarUiRecyclerView 的 android:endMargin,因此 兩者都有等量的邊界如果開發人員 enableDivider=true,原始設備製造商 (OEM) 可以控制分隔線的顯示方式。 可針對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。總共這四個觀看次數 :

View
Car_ui_scrollbar_page_up 定義捲軸的向上按鈕。
Car_ui_scrollbar_page_down 定義捲軸的向下按鈕。
Car_ui_scrollbar_thumb 高度會根據 Recycler View (RV)。
Car_ui_scrollbar_track 定義指標移動邊界的總高度。

原始設備製造商 (OEM) 應疊加這個版面配置檔案,以便自訂捲軸。 以便定義大拇指移動的邊界。 滑桿高度是根據休旅車中的清單項目和高度而動態計算 。

此版面配置包含在 CarUiRV 容器中 只有car_ui_scrollbar_enable 時才car_ui_recycler_view.xmltrue

其他可依捲軸調整的維度:

  <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. 如要定義要由 RRO 重疊的資源,請新增 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 套件中使用了任何新資源,則 請務必於您建立的 RRO APK 中定義這些資源。