Hello! I have a clickable

Row

. It's shape has radius. I ve added

clickable

modifier and the ripple effect does not respect the shape... How I can implement the desired behavior (apart from wrapping my composable with

Card

:P)

some time the order of your modifiers may affect the behavior of your composable.

I know... I ve added the clickable modifier last to be sure about the shape but the problem persists :S

How are you applying the shape to the row? You should add a clip modifier if you aren't using one to clip the ripple to the same shape

I ve just tried this... I am waiting for the build. Probably this was the issue as I had set the shape in the

background

Take a look at the Material Surface implementation for an example of what to do

It works! thank you very much 🙂

@Louis Pullen-Freilich [G] i do wonder if having clickable take a shape would be useful. I also have a case that I can't figure out how to setup because clip doesn't work for me (i have a piece of the UI that i dont want clipped). so just having a shape as an arg for clickable would actually be really handy. similar to how background has a shape arg. https://kotlinlang.slack.com/archives/CJLTWPH7S/p1659095156736129

I don’t see how that would help in your case, you can already do something like:

Modifier.indication(...).clip(shape).clickable()

If you want to draw the indication (ripple) outside of the bounds of the clickable. Not sure what adding shape would do here to help

Nope. I don't want to draw outside of the ripple. Currently my ripple is square but my item has rounded corners so I want to clip that. When I attempt to clip it though it clips my person that is offset out of the cell. Maybe I'll try again. Sounds like you think it should be possible. Thanks Louis

I don't think I understand, you don't want to draw outside of the ripple, but you want to draw the person outside of the ripple?

Let me rephrase. I have a rounded box. With an image dead center. Rounded box is clickable. I want this ripple to be rounded as well. If I use clip modifier then this works perfectly. Designer comes back and says. Hey can we offset the image so it peaks out from the top of the rounded box? Sure thing. Simple change. Add an offset to the image. But now the image is clipped. So I remove the clip modifier, but now my touch ripple isn't rounded (to match the rounded Box). So I am sad. 😂

Right, yes that's a bit tricky. You can do it easily if you just draw the person separately on top of the rest, but then it will draw over the ripple

Hm. Yeah. I'd like the ripple to be drawn over the person as well. I'll keep playing with it, but this is originally where I thought having a shape arg in a clickable would help.

That wouldn’t help here I guess

Gotcha. Maybe I misinterpreted. Sorry for derailing. 😅

I think you could do this if you do:

Box {
    // clickable and ripple
    Box()
    // background and person
    Box()
}

Will give it a go. Thank you