Personalizza CarUiRecyclerView

Questa pagina descrive il processo di personalizzazione di CarUiRecyclerView e della barra di scorrimento.

Prerequisiti

Questa pagina presuppone la conoscenza di un APK di destinazione Runtime Resource Overlay (RRO). Per ulteriori informazioni, consulta Personalizzare le app .

Informazioni su CarUiRecyclerView

Quando car_ui_scrollbar_enable è impostato su false in bools.xml , CarUiRecyclerView non gonfia la barra di scorrimento. Detto questo, solo androidx.recyclerview è arricchito con stili personalizzabili come definito di seguito. Quando car_ui_scrollbar_enable è impostato su true , CarUiRecyclerView gonfia il contenitore con la barra di scorrimento installata al suo interno. Successivamente nello stesso contenitore viene aggiunto anche androidx.recyclerview .

CarUiRecyclerView può utilizzare qualsiasi adattatore per visualizzare i dati. Ma la raccomandazione è di utilizzare CarUiListItemAdapter dove la libreria dello chassis definisce il layout per listItems e quindi può essere personalizzata dagli OEM. La personalizzazione per ListItems è definita nelle Opzioni di personalizzazione per CarUiListItem .

Per impostazione predefinita, car_ui_scrollbar_margin viene utilizzato come larghezza della vista della barra di scorrimento. Questo margine viene aggiunto anche come android:endMargin di CarUiRecyclerView, quindi c'è un margine uguale all'inizio e alla fine dei dati. Se lo sviluppatore avesse utilizzato enableDivider=true , l'OEM può controllare come dovrebbero apparire i divisori. Le dimensioni che possono essere regolate per CarUiRecyclerView sono:

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

Barra di scorrimento

Il file di layout per la barra di scorrimento CarUiRV è definito in car_ui_recyclerview_scrollbar.xml . In totale, queste quattro viste sono definite all'interno della vista:

Visualizzazioni
Car_ui_scrollbar_page_up Definisce il pulsante su della barra di scorrimento.
Car_ui_scrollbar_page_down definisce il pulsante giù della barra di scorrimento.
Car_ui_scrollbar_thumb L'altezza viene calcolata dinamicamente in base al numero di elementi dell'elenco nella vista Riciclatore (RV).
Car_ui_scrollbar_track Altezza totale che definisce i limiti entro i quali si sposterà il pollice.

Gli OEM dovrebbero sovrapporre questo file di layout per personalizzare la barra di scorrimento. La visualizzazione della traccia deve essere posizionata con attenzione poiché ciò definirebbe i limiti in cui si sposterà il pollice. L'altezza del pollice viene calcolata dinamicamente in base agli elementi dell'elenco nel camper e all'altezza dei visualizzatori.

Questo layout è incluso nel contenitore CarUiRV car_ui_recycler_view.xml solo se car_ui_scrollbar_enable è true .

Altre dimensioni che possono essere regolate per la barra di scorrimento sono:

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

Esempio

Ad esempio, per unire le frecce Su e Giù nella parte inferiore dello schermo:

  1. Sovrapposizione 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. Per definire le risorse che devono essere sovrapposte dall'RRO, aggiungere 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. Se è necessario aggiornare un elemento disegnabile Su, Giù o pollice, anche questi devono essere sovrapposti.
  4. Se nel pacchetto RRO vengono utilizzate nuove risorse che non esistono già, tali risorse devono essere definite anche nell'APK RRO creato.