I am trying to use jetpack compose 1.0.0-beta08. If I add clickable to Text it works but only text field ripples so what is the problem on Card click ?
@Composable
fun FoodCategoryChip(
text: String,
onClick: (String) -> Unit
) {
Card(
modifier = Modifier
.padding(8.dp)
.clickable(onClick = { onClick(text) }),//this is not working
elevation = 8.dp,
shape = MaterialTheme.shapes.medium,
) {
Text(
text = text,
modifier = Modifier
.padding(8.dp)
.wrapContentHeight(Alignment.CenterVertically),
color = Color.Black,
)
}
}
For instance a component like Button in Jetpack Compose which provides an onClick listener is using Clickable under the hood. If you are interested in exploring other components in Jetpack Compose you can check out the series of articles that I have written. How to make a Scrollable list in Jetpack Compose?
We can define what happens when the user clicks on a Clickable component in the onClick method. A Clickable component does not provide a touch feedback for that we need to wrap our Clickable inside a Ripple component. If we are doing so then consumeDownOnStart should have a false value otherwise it can be true.
The Card composable is a surface that can be used to present content and actions focused on a single topic. If you’re enjoying my posts on Jetpack Compose, check out some details on the book I’m writing on Compose!
A Card is a container that can be used as a parent view for declaring multiple UI elements inside it. It has an elevation property that applies a shadow effect around it. In this article, we will show you how you could implement a simple Card in Android using Jetpack Compose. Follow the below steps once the IDE is ready.
Starting from 1.0.0-beta08
with the Card
you have to use the version with the onClick
parameter:
BEHAVIOUR-BREAKING: Card now consumes clicks, making clicks added via Card(Modifier.clickable) to be a no-op. Please, use new experimental overload of a Card that accepts onClick.
Card(
onClick = { /*...*/ },
modifier = Modifier
.padding(8.dp),
elevation = 8.dp,
shape = MaterialTheme.shapes.medium,
) {
//..
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With