5

I am working on a custom layout that presents a day timeline in Jetpack Compose using Layout composable. The result looks like Google's Calenar and code is similar to the one described in that great tutorial: https://danielrampelt.com/blog/jetpack-compose-custom-schedule-layout-part-1/

My question is however: How could I receive (x, y) position of a click within a Layout composable. I could easily receive clicks made on children of the Layout by adding clickable modifier to the placeables. My question is however, how I receive position of clicks made on the space of layout between the childeren

(that would be the space between appointments in the day timeline according to previously mentioned example. And in that case I need the position of the click to get info on which hour user clicked)

I tried to add .clickable modifier on the whole Layout composable, but I do not receive (x, y) position of the click within the layout in the onClick lambda (it's type is () -> Unit)

PGliw
  • 311
  • 4
  • 9
  • You shouldn't ask two questions in one, because it'll be hard for others to find it. Also your question has nothing specific to Calendar. See [How do I ask a good question](https://stackoverflow.com/help/how-to-ask). You can split your question in two. The first one can be: "How to get clickable position?". The second one can be "How to get parent view click containts multiple clickable children?", and it's really depend on your layout, so you need to provide a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) you're having trouble with. – Phil Dukhov Dec 12 '21 at 01:21
  • You can edit this question to one of those, and create the second one. Also phrases like "I would appreciate any forms of help, thank you in advance." are redundant and shouldn't be used, see more info [here](https://meta.stackexchange.com/a/3021/794244). – Phil Dukhov Dec 12 '21 at 01:22
  • @PhilipDukhov Ok, the question was updated – PGliw Dec 12 '21 at 02:30

1 Answers1

8

You can use detectTapGestures, it'll return the offset:

Modifier.pointerInput(Unit) {
    detectTapGestures { offset ->

    }
}

If you need to add a ripple effect to this gesture, see this answer. In your case, you may need an array of MutableInteractionSource for each child view and one for the parent view.

You can find more custom gestures in Compose documentation.

Phil Dukhov
  • 67,741
  • 15
  • 184
  • 220
  • That turn out to be the right solution. When `roundToPx` is used in correct places (that is important, `detectTapGestures` returns pixels, thus we need take it into account when want to compare it with `Dp`s - the `Dp`s need to be transformed to `Px`s by calling `roundToPx()`) the soluction works perfectly well. – PGliw Dec 12 '21 at 17:00
  • quick question can we detect both click and drag. basically i have a custom layout that i can drag with offset and i need to center a perticular item on click https://gist.github.com/raghunandankavi2010/419ebac4ff7dd111697b86308ea0b20e – Raghunandan Aug 04 '22 at 14:43
  • @Raghunandan no, you have to build such method by yourself. take `detectTapGestures` and `detectDragGestures` source code as references – Phil Dukhov Aug 05 '22 at 05:20