Zenn
Open2

JetpackComposeのRipple

Android
Jetpack Compose
#
text
#
ripple
hiraokhiraok

TextButtonとかButtonだとDefualtで上下に8dpのPaddingがある場合Textにborderとかつけて
やった時のRippleエフェクトがうまくborder内を沿う形に行かなかったので調査

hiraokhiraok

ポイントはclickableの前にclipをセットする

Text(modifier = Modifier
        .clip(CircleShape)
        .clickable(onClick = {})
        .border(1.dp, Color.WHITE, CircleShape)
        .padding(vertical = 4.dp, horizontal = 12.dp),
        text = "Click!",
        style = MaterialTheme.typography.labelLarge,
)