具有多个可点击区域/表面/区域的图像

Question

I want to have an image on the android screen where different parts of the image can be clickable. What I mean is that, If its an image of 3 circles, I want to be able to click each of these circles,

Then I can add different functionalities to each of these clickable circles. For an instance in this image below I want to be able to click each distinct color. Is it possible to have on-touch-listener and get you the color ? and can it be an image or has to be drawn in Java OR XML ?

Answer 1

I found a really good widget that helps you make any image muli-clickable. They have some good notes on how to use their widget as well.

The widget has a similar approach as Image mapping in html. The good thing about this widget is that the image can be zoomed and it will not lose the coordinates or areas associated to specific clicks.

Here is the link to their website. the guy who made the widget apparently had similar problem and came up with this widget.

Answer 2

Another solution would have been

• creating an ImageView containing the png file referenced
• making the whole ImageView clickable
• setting an OnTouchListener to the ImageView which overrides the onTouch method
• check the colors of the image pixel at the touch position

This is often done with an invisible mask image with one color for each zone (see the popular detailed tutorial ), but here the image itself has distinct colors for each zone which makes it more interesting.