Irregular shaped clickable object

how-to

#1

Is it possible to make an irregularly shaped image clickable? Like a touching a country on a map and showing information about that country. Example:

Displaying a map of Africa and making Libya a touchable object which displays more information about Libya.


#2

Hi @j-geis,

This is not possible at the moment but that’s a known enhancement possibility for our future roadmap.

Seb


#3

What about breaking the map image up in Photoshop, loading them into your content library, then dropping them into the scene as buttons, assembled into the whole continent?


#4

That would work, but you end up with a lot of overlap since button shapes are square. I thought about using a circle on tap and placing within the country, but you still loose a little tappable real-estate depending on the shape of the country.


#5

If you drag a button into your scene, then left click the button icon in the Properties panel, you get the Image Button option. After selecting that option, you’ll see an Images pane appear lower down in properties; here, you can navigate to the images you want to use for Released and Pressed states in your Content Library (could be the same image, obviously). This way, you’re not dealing with polygons but with whatever images–including maps of African countries–you choose. Hope this helps.


#6

Images are also rectangular in shape, event if it’s a png with a transparency around the shape of the country. It would be nice if we could use svg which could be irregular in shape.


#7

Here is a possible solution that worked for us when we had to create rounded interactive areas and a player in the middle. We replicated and overlapped rectangular buttons to cover the clickable surfaces and made the buttons transparent.


#8

Awesome. Thank you.