Is there a way to make a click `Interaction` render behind the content of a composable? Say we have...

# compose

[chris-horner]

Is there a way to make a click Interaction render behind the content of a composable?

Say we have

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)

[xxfast]

hard to see if this works-or-not, but does Modifier.zIndex() does anything here?

Box(
  modifier = Modifier
    .clickable(
      interactionSource = remember { MutableInteractionSource() },
      indication = rememberRipple(),
      onClick = {}
    )
    .zIndex(-1f)
) {
  Text(text)
}

[xxfast]

nvm - doesn’t looks like that does anything

[Andrew Neal]

Yeah, I'm curious about this too. We're also solving it by adding another Box, but not needing it would be ideal.

[Louis Pullen-Freilich [G]]

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

[Andrew Neal]

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.

[chris-horner]

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