Questa pagina illustra le opzioni di personalizzazione per gli elementi dell'elenco CarUiListItem.
Il paradigma accettato per l'utilizzo della raccolta di UI dell'auto per visualizzare un elenco di elementi è utilizzare un CarUiRecyclerView insieme a oggetti CarUiListItemAdapter e CarUiListItem.
La personalizzazione di CarUiRecyclerView è descritta in
caruirecyclerview.
Prerequisiti
I contenuti riportati di seguito presuppongono la conoscenza degli overlay delle risorse di runtime (RRO) descritti in Personalizzare le app.
Informazioni su CarUiListItem
Gli elementi dell'elenco possono essere di due tipi di alto livello: header o content. Ognuna è brevemente descritta di seguito.
Intestazione
CarUiListItemAdapter lega oggetti di tipo CarUiHeaderListItem
a una visualizzazione espansa dal file di layout car_ui_header_list_item, che contiene
queste visualizzazioni:
| Visualizzazioni | |
|---|---|
title |
TextView del titolo |
body |
Testo visualizzato del corpo |
Ad esempio, l'elemento dell'elenco di intestazioni riportato di seguito è configurato per visualizzare un titolo e un testo.
Contenuti
CarUiListItemAdapter lega oggetti di tipo CarUiHeaderListItem
a una visualizzazione espansa dal file di layout car_ui_list_item. Questo file contiene le seguenti visualizzazioni:
| Visualizzazioni | |
|---|---|
icon_container |
Contenitore per l'icona principale |
title |
TextView del titolo |
body |
Testo visualizzato del corpo |
action_container |
Contenitore per la visualizzazione dell'azione |
Ad esempio, l'elemento dell'elenco di contenuti riportato di seguito è stato configurato per visualizzare un'icona e un'opzione:
Icone
A seconda del tipo di icona configurato per l'elemento dell'elenco, per l'icona principale viene utilizzata una delle tre seguenti visualizzazioni:
| Visualizzazioni | |
|---|---|
icon |
ImageView icona standard |
content_icon |
ImageView icona contenuto |
avatar_icon |
ImageView icona avatar |
Elementi di azione
Viene visualizzata al massimo una delle seguenti visualizzazioni degli elementi di azione, in base al tipo di azione per l'elemento dell'elenco:
| Visualizzazioni | |
|---|---|
switch_widget |
Switch |
checkbox_widget |
CheckBox |
radio_button_widget |
RadioButton |
supplemental_icon |
ImageView |
Personalizzare il testo
Lo stile del testo negli elementi dell'elenco di intestazioni e contenuti è controllato dagli stili di aspetto del testo definiti nella raccolta UI dell'auto. Per sostituire lo stile di testo degli elementi dell'elenco, sostituisci gli stili corrispondenti elencati di seguito.
Per personalizzare gli stili delle intestazioni:
| Stili di intestazione | |
|---|---|
| Testo del titolo | @style/TextAppearance.CarUi.ListItem |
| Corpo del testo | @style/TextAppearance.CarUi.ListItem.Body |
Per personalizzare gli stili dei contenuti:
| Stili dei contenuti | |
|---|---|
| Testo del titolo | @style/TextAppearance.CarUi.ListItem.Header |
| Corpo del testo | @style/TextAppearance.CarUi.ListItem.Body |
Personalizzare le icone
Gli elementi dell'elenco di contenuti possono contenere sia un'icona principale che un'icona supplementare.
Icona principale
Sebbene nel contenitore delle icone nel layout dell'elemento dell'elenco di contenuti siano definiti tre oggetti ImageView, viene visualizzata al massimo un'icona in base al tipo di icona specificato per l'elemento dell'elenco. Al momento del collegamento degli elementi, CarUiListItemAdapter imposta la visibilità appropriata per gli oggetti ImageView dell'icona.
La larghezza e l'altezza delle icone sono controllate da valori di dimensione che possono essere sovrapposti per regolare le dimensioni. Di seguito sono elencati i valori delle dimensioni che specificano la larghezza e l'altezza per i vari tipi di icone.
Icona standard
Per impostazione predefinita, le icone standard hanno altezza e larghezza uguali.
| Icona standard | |
|---|---|
| Larghezza | car_ui_list_item_icon_size |
| Altezza | car_ui_list_item_icon_size |
Icona dei contenuti
| Icona dei contenuti | |
|---|---|
| Larghezza | car_ui_list_item_content_icon_width |
| Altezza | car_ui_list_item_content_icon_height |
Icona avatar
Per impostazione predefinita, le icone principali sono centrate nella visualizzazione del contenitore di icone, che ha una larghezza definita dal valore della dimensione car_ui_list_item_icon_container_width.
| Icona avatar | |
|---|---|
| Larghezza | car_ui_list_item_content_icon_width |
| Altezza | car_ui_list_item_content_icon_height |
Icona supplementare
L'icona supplementare è centrata nella visualizzazione del contenitore di azioni. Sia la larghezza sia l'altezza dell'icona supplementare sono definite dal valore della dimensione car_ui_list_item_supplemental_icon_size. Sovrapponi questo valore della dimensione per modificare le dimensioni dell'icona supplementare.