https://kotlinlang.org logo
k

Kshitij Patil

11/02/2020, 6:53 PM
Canvas click events are not working once we wrap them inside a
Composable
Copy code
Box(Modifier.fillMaxSize()) {
    Canvas(Modifier.clickable { Log.i(TAG, "Clicked") }) {
        drawCircle(Color.Red, 25f, Offset(150f,150f))
    }
}
I want only the portion of Circle clickable, I tried clipping the Canvas, didn't help. Canvas click events only work within
Surface
, that too, on the entire Canvas area.
r

romainguy

11/02/2020, 6:56 PM
clickable()
can’t know what shape you want to restrict the click to
(we could do it when there’s clipping I suppose but that could also lead to surprising behaviors)
You probably need a custom input handler
That said, not sure why clicks wouldn’t work inside a
Box
but would inside a
Surface
. @Adam Powell?
k

Kshitij Patil

11/02/2020, 7:29 PM
I agree with that: clickable won't know the shape beforehand. I remember we used to do write custom views and was able to handle click/touch/gesture events by implementing respective listeners. Should I create a custom layout instead to do the same using Jetpack Compose? I didn't get what you mean by custom input handler and how should I implement the same in Compose.
a

Adam Powell

11/02/2020, 7:31 PM
clickable should size the clickable region to the size of the element it modifies. It should be equivalent here to do
Canvas(Modifier.fillMaxSize().clickable...)
as for
Surface
, cc @matvei for specific behavior differences there
k

Kshitij Patil

11/02/2020, 7:56 PM
I'm sorry for the confusion ☹️, I just realized it's not the issue with Box vs Surface, but it's about
fillMaxSize()
modifier on the Canvas.
Canvas
is not clickable unless it is preceded by the
fillMaxSize
modifier.
wrapContentSize
doesn't make any difference, so it seems like a compulsory step for the Canvas to have
fillMaxSize()
modifier to be a clickable
a

Andrey Kulikov

11/02/2020, 7:59 PM
not exactly
fillMaxSize()
, but any layout modifier. you can set some fixed size with `Modifier.size(48.dp)`In your case you had clickable area with 0x0 size
difference between Box and Surface is that Box looses constraints for its children. If Box is asked to fill the whole size it doesn't mean the children of Box are also forced to do so. Surface is currently not doing the same thing, but will in the future
k

Kshitij Patil

11/02/2020, 8:02 PM
Okay, got it. Thanks!
4 Views