2

I want to create a clickable image, my image has some different clickable parts in it, like this one:

I want to draw a custom shape like : A,B,C,D,E,F and make sure when user click on of this something happen. the problem is I don't have any kind of idea to, how create shapes like the shapes in the image make sure it just fix on the image and in different screen size don't see a massed up thing.

Gastón Saillén
  • 12,319
  • 5
  • 67
  • 77
Milad Na
  • 53
  • 1
  • 10
  • **Simplify** your life: In a RelativeLayout, use this as the background, then put some (normal) rectangular ImageViews on top of this one. A certain approximation is allowed. – Phantômaxx Feb 13 '15 at 12:16
  • 1
    Look at this https://github.com/catchthecows/AndroidImageMap – Ketan Ahir Feb 13 '15 at 12:31
  • yeah this is the easiest way but but bcz the image are some plan the y can have very bad shapes and rectangle and square and circle cant help me. – Milad Na Feb 13 '15 at 12:31
  • Or... do a clickable legend! So you would have some buttons BELOW the floor plan, each with a color background and a letter (i.e.: F, D and B with a pink back, E with a green back and A and C with a blue back). This is even **simpler**! – Phantômaxx Feb 13 '15 at 13:19
  • In the very end, you could use a real imagemap, contained in a WebView (this solution would also allow for scrollable contents). – Phantômaxx Feb 13 '15 at 13:22
  • tnx let me check it, it semms usefulllll @ketan-ahir – Milad Na Feb 13 '15 at 16:11
  • 1
    yeah it my last plan if i cant create and reach my goal, i do this ;) @der-golem – Milad Na Feb 13 '15 at 16:12
  • @KetanAhir tnx for the link but a probblem:), i just find out android image map just work on fuullll screen, i want show my plan in something like header. can u give me some help about this? – Milad Na Feb 13 '15 at 22:06

2 Answers2

2

Will there be more than many of such images?

If no I suggest you to create mask image for each region where black part of image represents the region and white part excludes rest.

To draw image:

To handle click events:

To optimise:

  • create mask image downscaled by some scale factor
  • during comparison divide touch position by scale factor

This is not ideal, but solution with vectors is non trivial I think

Community
  • 1
  • 1
VizGhar
  • 3,036
  • 1
  • 25
  • 38
  • let me check android image map and if it didn't work i go this way. but i think this way seems little bit hard and it's take time for me, bcz a have 18 pic,less or more, – Milad Na Feb 13 '15 at 16:16
1

Take it as image and setOnclickListner for that image

Mayur R. Amipara
  • 1,223
  • 1
  • 11
  • 32
  • tnx but this way can't help i want some clickable area on the image. – Milad Na Feb 13 '15 at 12:28
  • take one layout and set its height width as on which area u want to setonclick.. than just add image in that layout and now setonclick event of whole layout... – Mayur R. Amipara Feb 13 '15 at 12:32
  • 1
    This will not help him also, because you are still working with rectangle region. He needs to Draw region on ImageView and handle click events for each region – VizGhar Feb 13 '15 at 12:50