how to use imagemapping with clickable areas in android?

Question

how to use imagemapping with clickable areas in android?

I want to render image for my android application and I added two images to the scrollview in my design class. I created different clickable areas in the mask image that is invisibile, and when I click on these areas, I want the images I defined to appear, but I can't get any results.

Here is my activity class:

 



        ImageView image = (ImageView) findViewById (R.id.image);
        if (image != null) {
            image.setOnTouchListener (this);
        }
        toast ("Touch the screen to discover where the regions are.");
    }
    public boolean onTouch (View v, MotionEvent ev)
    {
        boolean handledHere = true;

        final int action = ev.getAction();

        final int evX = (int) ev.getX();
        final int evY = (int) ev.getY();
        int nextImage = -1;

        ImageView imageView = (ImageView) v.findViewById (R.id.image);
        if (imageView == null) return false;

        Integer tagNum = (Integer) imageView.getTag ();
        int currentResource = (tagNum == null) ? R.drawable.seatmap : tagNum.intValue ();


        switch (action) {
            case MotionEvent.ACTION_DOWN :
                if (currentResource == R.drawable.seatmap) {
                    nextImage = R.drawable.pre1;
                    handledHere = true;
       /*
       } else if (currentResource != R.drawable.p2_ship_default) {
         nextImage = R.drawable.p2_ship_default;
         handledHere = true;
       */
                } else handledHere = true;
                break;

            case MotionEvent.ACTION_UP :
                int touchColor = getHotspotColor (R.id.image_areas, evX, evY);

                ColorTool ct = new ColorTool ();
                int tolerance = 25;
                nextImage = R.drawable.seatmap;
                if (ct.closeMatch (Color.RED, touchColor, tolerance)) nextImage = R.drawable.pre3;
                else if (ct.closeMatch (Color.BLUE, touchColor, tolerance)) nextImage = R.drawable.preorder1;
                else if (ct.closeMatch (Color.YELLOW, touchColor, tolerance)) nextImage = R.drawable.preorder2;
                else if (ct.closeMatch (Color.WHITE, touchColor, tolerance)) nextImage = R.drawable.seatmap;

                // toast ("Current image: " + currentResource + " next: " + nextImage);
                if (currentResource == nextImage) {
                    nextImage = R.drawable.seatmap;
                }
                handledHere = true;
                break;
            default:
                handledHere = false;
        }

        if (handledHere) {

            if (nextImage > 0) {
                imageView.setImageResource (nextImage);
                imageView.setTag (nextImage);
            }
        }
        return handledHere;
    }

    public int getHotspotColor (int hotspotId, int x, int y) {
        ImageView img = (ImageView) findViewById (hotspotId);
        if (img == null) {
            Log.d ("ImageAreasActivity", "Hot spot image not found");
            return 0;
        } else {
            img.setDrawingCacheEnabled(true);
            Bitmap hotspots = Bitmap.createBitmap(img.getDrawingCache());
            if (hotspots == null) {
                Log.d ("ImageAreasActivity", "Hot spot bitmap was not created");
                return 0;
            } else {
                img.setDrawingCacheEnabled(false);
                return hotspots.getPixel(x, y);
            }
        }
    }
    public void toast (String msg)
    {
        Toast.makeText (getApplicationContext(), msg, Toast.LENGTH_LONG).show ();
    }

I wanted to define two images(of the same size), one visible and one invisible, inside the scrollview and this is my design class:

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="15dp"
    android:background="#ffffff"
    tools:context=".MainActivity">


    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="521dp"
        android:scrollbarAlwaysDrawVerticalTrack="true">

        <ImageView
            android:id="@+id/image_areas"
            android:layout_width="fill_parent"
            android:scaleType="fitCenter"
            android:layout_height="fill_parent"
            android:adjustViewBounds="true"
            android:contentDescription="Specs"
            android:scrollbars="vertical"
            android:visibility="visible"
            android:src="@drawable/seatmapmask" />

        <ImageView
            android:id="@+id/image"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scaleType="fitCenter"
            android:adjustViewBounds="true"
            android:contentDescription="Specs"
            android:scrollbars="vertical"
            android:visibility="visible"
            android:src="@drawable/seatmap" />
    </ScrollView>

    <ImageView
        android:id="@+id/backButton"
        android:layout_width="match_parent"
        android:layout_height="84dp"
        app:srcCompat="@drawable/go_back_up" />

</LinearLayout>