Sering kali aplikasi perlu menampilkan data dalam container dengan gaya yang mirip. Container ini
sering digunakan dalam daftar untuk menampung informasi setiap item. Sistem menyediakan
CardView
API sebagai cara mudah untuk menampilkan
informasi di dalam kartu yang memiliki tampilan konsisten di seluruh platform. Kartu
ini memiliki elevasi default di atas kelompok tampilan yang menampungnya, sehingga sistem
menggambar bayangan di bawahnya. Kartu memberikan cara mudah untuk menampung sekelompok tampilan,
sekaligus memberikan gaya yang konsisten untuk container.

Gambar 1. Contoh kartu
Menambahkan dependensi
Widget CardView
adalah bagian dari AndroidX. Untuk menggunakannya dalam project Anda,
tambahkan dependensi berikut ke file build.gradle
modul aplikasi Anda:
Groovy
dependencies { implementation "androidx.cardview:cardview:1.0.0" }
Kotlin
dependencies { implementation("androidx.cardview:cardview:1.0.0") }
Membuat Kartu
Agar dapat menggunakan CardView
, Anda perlu menambahkannya ke file
tata letak. Gunakan ini sebagai kelompok tampilan untuk menampung tampilan lain. Dalam contoh ini,
CardView
berisi satu TextView
untuk menampilkan informasi tertentu kepada pengguna.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:card_view="http://schemas.android.com/apk/res-auto" ... > <!-- A CardView that contains a TextView --> <androidx.cardview.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto" android:id="@+id/card_view" android:layout_gravity="center" android:layout_width="200dp" android:layout_height="200dp" card_view:cardCornerRadius="4dp"> <TextView android:id="@+id/info_text" android:layout_width="match_parent" android:layout_height="match_parent" /> </androidx.cardview.widget.CardView> </LinearLayout>
Kartu digambar ke layar dengan elevasi default, yang menyebabkan sistem menggambar
bayangan di bawahnya. Anda dapat memberikan elevasi kustom untuk kartu dengan
atribut card_view:cardElevation
. Atribut ini akan menggambar bayangan yang lebih jelas dengan
elevasi yang lebih besar, dan elevasi yang lebih rendah akan menghasilkan bayangan yang lebih terang.
CardView
menggunakan elevasi riil dan bayangan dinamis di Android 5.0
(API level 21) dan yang lebih baru, serta melakukan fallback ke implementasi bayangan terprogram pada versi lebih lama.
Gunakan properti ini untuk menyesuaikan tampilan
widget CardView
:
- Untuk menetapkan radius sudut dalam tata letak Anda, gunakan atribut
card_view:cardCornerRadius
. - Untuk menetapkan radius sudut dalam kode Anda, gunakan metode
CardView.setRadius
. - Untuk menetapkan warna latar belakang kartu, gunakan atribut
card_view:cardBackgroundColor
.
Untuk informasi selengkapnya, lihat referensi API untuk CardView
.