Cette page décrit le processus de personnalisation CarUiRecyclerView
et de la barre de défilement.
Conditions préalables
Cette page suppose la connaissance d’un APK cible de superposition de ressources d’exécution (RRO). Pour en savoir plus, consultez 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. Cela dit, seule la androidx.recyclerview
est gonflée de styles personnalisables tels que définis ci-dessous. Lorsque car_ui_scrollbar_enable
est défini sur true
, CarUiRecyclerView
gonfle le conteneur avec la barre de défilement installée à l'intérieur. Plus tard, androidx.recyclerview
est également ajouté dans le même conteneur.
CarUiRecyclerView
peut utiliser n'importe quel adaptateur pour afficher les données. Mais la recommandation est d'utiliser CarUiListItemAdapter
où la bibliothèque de châssis définit la disposition des listItems et peut donc être personnalisée par les OEM. La personnalisation de ListItems est définie dans les options de personnalisation de CarUiListItem .
Par défaut, car_ui_scrollbar_margin
est utilisé comme largeur de la vue de la barre de défilement. Cette marge est également ajoutée sous le nom android:endMargin
de CarUiRecyclerView afin qu'il y ait une marge égale au début et à la fin des données. Si le développeur a utilisé enableDivider=true
, l'OEM peut contrôler la manière dont les séparateurs doivent apparaître. Les dimensions qui peuvent être ajustées pour CarUiRecyclerView
sont :
<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 de 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 :
Vues | |
---|---|
Car_ui_scrollbar_page_up | Définit le bouton haut de la barre de défilement. |
Car_ui_scrollbar_page_down | définit le bouton bas de la barre de défilement. |
Car_ui_scrollbar_thumb | La hauteur est calculée dynamiquement en fonction du nombre d'éléments de liste dans la vue Recycler (RV). |
Car_ui_scrollbar_track | Hauteur totale qui définit les limites dans lesquelles le pouce se déplacera. |
Les OEM doivent superposer ce fichier de présentation pour personnaliser la barre de défilement. La vue piste doit être placée avec soin car cela définirait les limites dans lesquelles le pouce se déplacera. La hauteur du pouce est calculée dynamiquement en fonction des éléments de la liste dans le RV et de la taille des spectateurs.
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 qui peuvent être ajustées pour la barre de défilement sont :
<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 rapprocher les flèches Haut et Bas en bas de l'écran :
- 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>
- Pour définir les ressources à superposer par le RRO, 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>
- Si un dessin haut, bas ou pouce doit être mis à jour, ils doivent également être superposés.
- Si de nouvelles ressources sont utilisées dans le package RRO qui n'existent pas déjà, ces ressources doivent également être définies dans l'APK RRO que vous créez.