Apps müssen oft Daten in ähnlich gestalteten Containern anzeigen. Diese Container werden oft in Listen verwendet, um die Informationen der einzelnen Elemente zu speichern. Das System bietet mit derCardView
API eine einfache Möglichkeit, Informationen in Karten darzustellen, die plattformübergreifend ein einheitliches Aussehen haben. Diese Karten sind standardmäßig höher als die sie enthaltende Ansichtsgruppe, so dass das System einen Schatten unter sie zeichnet. Karten bieten eine einfache Möglichkeit, eine Gruppe von Ansichten zu enthalten und gleichzeitig einen konsistenten Stil für den Container bereitzustellen.
Abbildung 1. Kartenbeispiele
Hinzufügen der Abhängigkeiten
Das CardView
Widget ist Teil von AndroidX. Um es in Ihrem Projekt zu verwenden, fügen Sie die folgende Abhängigkeit zur build.gradle
-Datei Ihres App-Moduls hinzu:
dependencies { implementation "androidx.cardview:cardview:1.0.0"}
Create Cards
Um das CardView
zu verwenden, müssen Sie es zu Ihrer Layout-Datei hinzufügen. Verwenden Sie es als eine Ansichtsgruppe, die andere Ansichten enthält. In diesem Beispiel enthält CardView
eine einzelne TextView
Karte, die dem Benutzer einige Informationen anzeigt.
Die Karten werden auf dem Bildschirm mit einer Standarderhebung gezeichnet, was dazu führt, dass das System einen Schatten unter sie zeichnet. Sie können mit dem Attributcard_view:cardElevation
eine eigene Höhe für eine Karte angeben. Dadurch wird ein ausgeprägterer Schatten mit einer größeren Höhe gezeichnet, und eine geringere Höhe führt zu einem helleren Schatten.CardView
verwendet echte Höhe und dynamische Schatten auf Android 5.0 (API-Level 21) und höher und fällt auf eine programmatische Schattenimplementierung auf früheren Versionen zurück.
Verwenden Sie diese Eigenschaften, um das Aussehen des Widgets CardView
anzupassen:
- Um den Eckenradius in Ihren Layouts einzustellen, verwenden Sie das Attribut
card_view:cardCornerRadius
. - Um den Eckenradius in Ihrem Code einzustellen, verwenden Sie die Methode
CardView.setRadius
. - Um die Hintergrundfarbe einer Karte einzustellen, verwenden Sie das Attribut
card_view:cardBackgroundColor
.