I did search the forum and found this. And I made an attempt of making a circle change its color when it is clicked upon. But the amount of nodes involved makes me believe that there is a simpler way to do this which I don’t know yet.
What I want to do to is to make a specific layer react to clicks, and clicking outside the layer (circle in my case) to not to do anything.
sorry to say, thats about as much nodes as you really need.
you could use skia´s circle (circle) and reuse the circle definition for both the drawing and hit test. but thats all you can simplify imo
Appreciate the reply, thanks!
Hi @tgd, I have a follow up to ask:
If there are two circles, one overlapping each other, and both are interactive, then how can I ensure that if I click on the intersection part then only the circle at the top reacts to it while the bottom one doesn’t? All in all, I only want the uppermost layer to react to click if there is an overlap between two interactive layers.
Is there something that can easily help me achieve this?
Unfortunately mouse and (especially) touch interaction have been severely neglected by the devvvvs. There is nothing ootb (that I know of). You can check out VL.IO.Multitouch (Example Touchable Layers.vl) for inspiration. But afaik it’s kinda broken and you’ll have to deduce how it is supposed to work just from looking at the patch.
That’s really unfortunate 😕. I was thinking to pick up vvvv to do UI prototyping like people used to do with Quartz Composer. And mouse and touch interaction are crucial for it.
Anyway, thanks for telling me about VL.IO.Multitouch and giving me an answer about overlaps.
my only take on this would be the draw order. given a simple loop to draw the circles, the topmost of the clicked circles is also the last one in the list of hits.
interaction-topmost.vl (25.6 KB)
Thanks @tgd . I’m able to follow what’s happening in your patch but I’ll chew on it to genericize it.
Quick question: Is there something called LayerIntersectPoint? Unlike say CircleContainsPoint, I’m trying to find a way to not to specify a layer’s position and dimension to this imaginary node and still get the answer back if a point intersects to it.
If something like this ^ doesn’t exist, is there a node to which I can pass a layer and it’ll give me back vertices of a polygon defining boundaries of the layer?
Hey, there is this patch in the Help Browser called MultiTouch in VL.Skia, that deals with layers overlapping each other. For me back then it took me quite a while to understand the logic, but learned a lot from it!
Oh this is quite helpful @chk, thank you! The rendered output itself doesn’t seem to respond to mouse clicks though — I was half expecting it because that’s what happens in the web.
MTStack’s definition does looks interesting, I will look into it!
Yes, it is working with touch input, but once you get the logic of the MTStack it should be doable to apply that logic to mouse input.
