Personnaliser CarUiRecyclerView

Cette page décrit le processus de personnalisation de CarUiRecyclerView et du défilement. sur la barre d'adresse.

Prérequis

Cette page suppose que vous connaissez un APK cible de superposition de ressources d'exécution (RRO). Pour apprendre En savoir plus, consultez l'article Personnaliser les applications.

À propos de CarUiRecyclerView

Lorsque car_ui_scrollbar_enable est défini sur false dans bools.xml, CarUiRecyclerView ne gonfle pas la barre de défilement. Ceci dit, seuls les androidx.recyclerview est gonflé à l'aide de styles personnalisables, comme indiqué ci-dessous. Lorsque car_ui_scrollbar_enable est défini sur true, CarUiRecyclerView gonfle le conteneur avec la barre de défilement installée qu'il contient. androidx.recyclerview plus tard est également ajouté dans le même conteneur.

CarUiRecyclerView peut utiliser n'importe quel adaptateur pour afficher les données. Toutefois, il est recommandé d'utiliser CarUiListItemAdapter, où la bibliothèque de châssis définit le pour listItems. Les OEM peuvent donc la personnaliser. Personnalisation de ListItems sont définis dans la section Personnalisation pour CarUiListItem.

Par défaut, car_ui_scrollbar_margin est utilisé comme largeur de la barre de défilement. Cette marge est également ajoutée en tant que android:endMargin de CarUiRecyclerView afin il y a une marge égale au début et à la fin des données. Si le développeur avait utilisé enableDivider=true, l'OEM peut alors contrôler l'affichage des séparateurs. Voici les dimensions pouvant être ajustées pour 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>

Barre de défilement

Le fichier de mise en page pour la barre de défilement CarUiRV est défini dans car_ui_recyclerview_scrollbar.xml Au total, ces quatre vues sont définies dans la vue:

Les OEM doivent superposer ce fichier de mise en page pour personnaliser la barre de défilement. La vue de piste doit être de façon à définir les limites de mouvement du pouce. La hauteur du pouce est calculée dynamiquement en fonction des éléments de la liste du camping-car et de la hauteur des lecteurs.

Cette mise en page est incluse dans le conteneur CarUiRV car_ui_recycler_view.xml uniquement si car_ui_scrollbar_enable est true.

Les autres dimensions pouvant être ajustées pour la barre de défilement sont les suivantes:

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

Exemple

Par exemple, pour rassembler les flèches vers le haut et vers le bas en bas de l'écran:

1. Superposition 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. Pour définir les ressources que la RRO doit superposer, ajoutez 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. Si vous devez mettre à jour un élément drawable vers le haut, le bas ou le curseur, vous devez également les superposer.
4. Si de nouvelles ressources qui n'existent pas encore sont utilisées dans le package RRO, ces ressources doivent également être définies dans l'APK RRO que vous créez.