I have custom styled a RadioButton for adding radiobutton image on the right side
On the "how to customize ripple effect" part, using Material Components library v1.1.0, the background is by default a RippleDrawable with its color set to a ColorStateList of 2 colors: A 26 alpha (#A1 in hex) colorControlActivated in enabled and checked state, and for the default state an alpha white or black depending on whether you have a light (#1F000000) or dark theme (#33FFFFFF). I retrieved this info simply by inspecting the background of a MaterialCheckBox in the debugger.
You can just override the color of the RippleDrawable however you wish using its setColor method. For example, if you want to only change the accent colored part of the ripple effect while using a DayNight theme, you can run this Kotlin code sample:
private val RIPPLE_ENABLED_CHECKED_STATES = arrayOf(
intArrayOf(android.R.attr.state_enabled, android.R.attr.state_checked),
intArrayOf())
fun Int.withAlpha(alpha: Int): Int {
require(alpha in 0..0xFF)
return this and 0x00FFFFFF or (alpha shl 24)
}
fun CompoundButton.changeCheckedRippleColor(@ColorInt color: Int) {
val defaultAlphaColor= if (context.resources.configuration.uiMode and
Configuration.UI_MODE_NIGHT_MASK == Configuration.UI_MODE_NIGHT_YES)
Color.WHITE.withAlpha(51)
else
Color.BLACK.withAlpha(31)
(background as? RippleDrawable)?.setColor(ColorStateList(RIPPLE_ENABLED_CHECKED_STATES,
intArrayOf(color.withAlpha(26), defaultAlphaColor)))
}