How can I make overlapping shapes clickable

Question

How can I make overlapping shapes clickable

Magnus Wallon 0

Hi, had this problem from time to time since I work with apps for kids. I want to make irraguated shapes that might overlap each others clickable like in this simple example image. How would you do that in .Net Maui? Hope the problem was understandable?
User's image

Anonymous

2024-03-18T07:30:01.11+00:00

What API are you going to use to achieve the effect in the picture?

The effect in the picture is an example? Or is it already a specific effect you need to achieve? And add click events to the red and blue graphics.
Magnus Wallon 0 Reputation points

2024-03-24T16:32:04.27+00:00

Hi sorry I missed your answer, the forms in my images represent 2 pngs with transparent backgrounds laying above each other, then if I click anywhere on the blue, one function gets called and the same with the red. So yes just simple click event but should only be triggered on the visible parts. worked for many years in flash and there was a library you could add so you could set invisible parts so the got ignored by click handlers.
Magnus Wallon 0 Reputation points

2024-03-24T16:40:34.9966667+00:00

This is how it would work now, gray area will represent click area of the red if that is on top, so the red will cover much of the blue aswell. This is a very simplyfied example though.. But if you think that you would make a worldmap with clickable countries you would have this problem everywhere.
Anonymous

2024-03-29T08:02:04.2866667+00:00

If you put the .png file to the ImageView and implement the result with absolution layout, if the covered blue area clicked, I think the method of red area will be invoked.

Have you tried drawing these two graphics using SkiaSharp?

Your answer

Anonymous

2024-03-18T07:30:01.11+00:00

What API are you going to use to achieve the effect in the picture?

The effect in the picture is an example? Or is it already a specific effect you need to achieve? And add click events to the red and blue graphics.
Magnus Wallon 0 Reputation points

2024-03-24T16:32:04.27+00:00

Hi sorry I missed your answer, the forms in my images represent 2 pngs with transparent backgrounds laying above each other, then if I click anywhere on the blue, one function gets called and the same with the red. So yes just simple click event but should only be triggered on the visible parts. worked for many years in flash and there was a library you could add so you could set invisible parts so the got ignored by click handlers.
Magnus Wallon 0 Reputation points

2024-03-24T16:40:34.9966667+00:00

This is how it would work now, gray area will represent click area of the red if that is on top, so the red will cover much of the blue aswell. This is a very simplyfied example though.. But if you think that you would make a worldmap with clickable countries you would have this problem everywhere.
Anonymous

2024-03-29T08:02:04.2866667+00:00

If you put the .png file to the ImageView and implement the result with absolution layout, if the covered blue area clicked, I think the method of red area will be invoked.

Have you tried drawing these two graphics using SkiaSharp?

Share via

How can I make overlapping shapes clickable

Your answer