Cara mudah mengganti background color komponen button di Jetpack Compose Kotlin Andorid

 

Sebelum mengganti warna background pada tombol kamu coba pastikan dulu versi material design yang kamu gunakan. Cara mengeceknya cukup mudah, coba kamu buka file build.gradle.kts, di baris bawah kamu akan menemukan dependencies apa saja yang kamu gunakan, kemudian cari kata "material", maka kamu akan menemukan berapa versi materialnya, biasanya di tulis seperti ini :

implementation("androidx.compose.material3:material3")

Saat artikel ini di tulis, versi material terbaru adalah versi 3.

Kemudian berikut ini adalah cara mengubah background color pada komponen button di Jetpack Compose:

colors = ButtonDefaults.buttonColors(containerColor = Color(android.graphics.Color.parseColor("#48A1FF")))

Kode lengkapnya kurang lebih seperti ini :

Button(
            shape = RoundedCornerShape(5),
            onClick = { /* your onclick code here */ },
            modifier = Modifier.size(80.dp, 55.dp),
            colors = ButtonDefaults.buttonColors(containerColor = Color(android.graphics.Color.parseColor("#48A1FF"))),
        ) {
            Text(text = "Tombol Kang Cahya")
        }

Maksud kode di atas adalah, membuat tombol dengan label "Tombol Kang Cahya", dengan bentuk kotak namun melengkung di bagian ujungnya sebesar 5%, ukuran tombolnya mempunyai lebar 50dp dan tinggi 55dp, lalu dengan latar belakang berwarna #48A1FF.

Antara Material 3 dengan versi sebelumnya (Material 2) sebenarnya ada sedikit perbedaan. Jika pada Material 3, kamu menggunakan containerColor, tapi di Material 2 kamu menggunakan backgroundColor, kurang lebih seperti ini :

Material 3

Button(
            shape = RoundedCornerShape(5),
            onClick = { /* your onclick code here */ },
            modifier = Modifier.size(80.dp, 55.dp),
            colors = ButtonDefaults.buttonColors(containerColor = Color(android.graphics.Color.parseColor("#48A1FF"))),
        ) {
            Text(text = "Tombol Kang Cahya")
        }

Material 2

Button(
            shape = RoundedCornerShape(5),
            onClick = { /* your onclick code here */ },
            modifier = Modifier.size(80.dp, 55.dp),
            colors = ButtonDefaults.buttonColors(backgroundColor = Color(android.graphics.Color.parseColor("#48A1FF"))),
        ) {
            Text(text = "Tombol Kang Cahya")
        }

Referensi : stackoverflow