Is there a way to make a click `Interaction` rende...
# compose
c
Is there a way to make a click
Interaction
render behind the content of a composable? Say we have
Copy code
Box(
  modifier = Modifier.clickable(
    interactionSource = remember { MutableInteractionSource() },
    indication = rememberRipple(),
    onClick = {}
  )
) {
  Text("Whaddup")
}
Is there a way to make the ripple render behind the text? (Without doing something like putting another
Box
behind the text)
x
hard to see if this works-or-not, but does
Modifier.zIndex()
does anything here?
Copy code
Box(
  modifier = Modifier
    .clickable(
      interactionSource = remember { MutableInteractionSource() },
      indication = rememberRipple(),
      onClick = {}
    )
    .zIndex(-1f)
) {
  Text(text)
}
nvm - doesn’t looks like that does anything
a
Yeah, I'm curious about this too. We're also solving it by adding another
Box
, but not needing it would be ideal.
l
Adding a box is the workaround in this case, ripples are explicitly designed to be on top of the content, so it's very suspicious that you want it to be behind the text, and not something we would want to explicitly support
👍 1
a
Our use case for it came up when we realized that's how the ripples behaved on our older buttons. So when we replaced them with Compose the ripple being on top of the content stood out.
c
Exactly the same issue we’ve run into. This is a change in behaviour and makes our compose content stick out as being slightly different from existing UI