Auf dieser Seite werden die Anpassungsoptionen für CarUiListItem Listenelemente detailliert beschrieben.
Das akzeptierte Paradigma für die Verwendung der Car-UI-Bibliothek zum Anzeigen einer Liste von Elementen ist die Verwendung einer CarUiRecyclerView in Verbindung mit einem CarUiListItemAdapter und CarUiListItem -Objekten. Die Anpassung CarUiRecyclerView wird in caruirecyclerview behandelt.
Voraussetzungen
Der folgende Inhalt setzt ein Verständnis der unter „Apps anpassen“ beschriebenen Laufzeitressourcen-Overlays (RRO) voraus.
Über CarUiListItem
Listenelemente können einen von zwei übergeordneten Typen haben: header oder content . Jedes wird unten beschrieben.
Header
CarUiListItemAdapter bindet Objekte vom Typ CarUiHeaderListItem an eine Ansicht, die aus der Layoutdatei car_ui_header_list_item aufgeblasen wurde, die diese Ansichten enthält:
| Ansichten | |
|---|---|
title | Titel TextView |
body | Textkörperansicht |
Das folgende Kopfzeilenlistenelement ist beispielsweise so konfiguriert, dass es einen Titel und einen Textkörper anzeigt:
Inhalt
CarUiListItemAdapter bindet Objekte vom Typ CarUiHeaderListItem an eine Ansicht, die aus der Layoutdatei car_ui_list_item aufgeblasen wurde. Diese Datei enthält diese Ansichten:
| Ansichten | |
|---|---|
icon_container | Container für das primäre Symbol |
title | Titel TextView |
body | Textkörperansicht |
action_container | Container für die Aktionsansicht |
Das folgende Inhaltslistenelement wurde beispielsweise so konfiguriert, dass es ein Symbol und einen Schalter anzeigt:
Symbole
Abhängig vom für das Listenelement konfigurierten Symboltyp wird eine der folgenden drei Ansichten für das primäre Symbol verwendet:
| Ansichten | |
|---|---|
icon | Standardsymbol ImageView |
content_icon | Inhaltssymbol ImageView |
avatar_icon | Avatar-Symbol ImageView |
Aktionselemente
Je nach Aktionstyp für das Listenelement wird höchstens eine der folgenden Aktionselementansichten angezeigt:
| Ansichten | |
|---|---|
switch_widget | Switch |
checkbox_widget | CheckBox |
radio_button_widget | RadioButton |
supplemental_icon | ImageView |
Text anpassen
Der Textstil in Kopfzeilen- und Inhaltslistenelementen wird durch Textdarstellungsstile gesteuert, die in der Car UI-Bibliothek definiert sind. Um den Textstil von Listenelementen zu überschreiben, überschreiben Sie die entsprechenden unten aufgeführten Stile.
So passen Sie Kopfzeilenstile an:
| Header-Stile | |
|---|---|
| Titeltext | @style/TextAppearance.CarUi.ListItem |
| Hauptteil | @style/TextAppearance.CarUi.ListItem.Body |
So passen Sie Inhaltsstile an:
| Inhaltsstile | |
|---|---|
| Titeltext | @style/TextAppearance.CarUi.ListItem.Header |
| Hauptteil | @style/TextAppearance.CarUi.ListItem.Body |
Passen Sie Symbole an
Elemente der Inhaltsliste können sowohl ein primäres als auch ein ergänzendes Symbol enthalten.
Primäres Symbol
Obwohl im Symbolcontainer im Layout des Inhaltslistenelements drei ImageView-Objekte definiert sind, wird basierend auf dem angegebenen Symboltyp des Listenelements höchstens ein Symbol angezeigt. Zum Zeitpunkt der Elementbindung legt CarUiListItemAdapter die entsprechende Sichtbarkeit für die Symbol-ImageView-Objekte fest.
Die Breite und Höhe von Symbolen werden durch Dimensionswerte gesteuert, die zur Steuerung der Größe überlagert werden können. Die Dimensionswerte, die die Breite und Höhe für die verschiedenen Symboltypen angeben, sind unten aufgeführt.
Standardsymbol
Standardmäßig haben Standardsymbole die gleiche Höhe und Breite.
| Standardsymbol | |
|---|---|
| Breite | car_ui_list_item_icon_size |
| Höhe | car_ui_list_item_icon_size |
Inhaltssymbol
| Inhaltssymbol | |
|---|---|
| Breite | car_ui_list_item_content_icon_width |
| Höhe | car_ui_list_item_content_icon_height |
Avatar-Symbol
Standardmäßig sind primäre Symbole in der Symbolcontaineransicht zentriert, deren Breite durch den Dimensionswert car_ui_list_item_icon_container_width definiert ist.
| Avatar-Symbol | |
|---|---|
| Breite | car_ui_list_item_content_icon_width |
| Höhe | car_ui_list_item_content_icon_height |
Ergänzendes Symbol
Das Zusatzsymbol ist in der Aktionscontaineransicht zentriert. Sowohl die Breite als auch die Höhe des Zusatzsymbols werden durch den Dimensionswert car_ui_list_item_supplemental_icon_size definiert. Überlagern Sie diesen Dimensionswert, um die Größe des Zusatzsymbols zu ändern.