CODEWITHSUNDEEP
android
Hawraa Khalil
Hawraa Khalil

Reputation: 261

Click ImageView on Specific Location

I have an imageView and when I need to let the user click only on a specific location (the white space) as shown in the image below, any suggestion?

enter image description here

here is my xml

    <RelativeLayout
            android:id="@+id/lockRelativeLayout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_marginStart="5dp"
            >
            <ImageView
                android:id="@+id/imageView"
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:background="@drawable/image" />
        </RelativeLayout>

and here is the code

    private View.OnTouchListener imageViewOnClickListener = new View.OnTouchListener() {

        @Override
        public boolean onTouch(View view, MotionEvent event) {
            int x = (int)event.getX();
            int y = (int)event.getY();
            if (event.getAction() == MotionEvent.ACTION_DOWN){
               //here i want if he clicked on specific location to go to another activity
 Intent intent = new Intent(context, ViewerActivity.class);
            context.startActivity(intent);
            }
            return true;
        }
    };

I don't know if i should use onClick or onTouchClick!!

Upvotes: 1

Views: 1486

Answers (4)

Rishi Paul
Rishi Paul

Reputation: 936

What i did is I used two images One for Show your Image and Secound is show only Some Part of that where you want to click

Please Note My Secound Image is my transparent image. So use one1 as a transparent image. And use its Click Event.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/ic_launcher" />
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@xml/shape"
    android:gravity="center" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/one1" />
</LinearLayout>

now create xml and create shape.xml file which is give to Linearlayout

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >

<corners android:radius="20dip" />

<stroke
    android:width="100dip"
    android:color="#A0ffffff" />

Upvotes: 2

Flaxie
Flaxie

Reputation: 540

You could implement the OnTouchListener. 

  anImageView.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            if(event.getAction() == MotionEvent.ACTION_DOWN){
                //Check between +- 10px jsu tto have some are to hit 
                int centerX = (v.getWidth() /2);
                if(event.getX() > centerX - 10) 
                     && event.getX() < centerX + 10)){
                    //Do your magic
                }
            }
            return true;
        }
    });

The event contains the coordinates for the event. Then you can compare that either to the the boundaries you set up or get the correct pixel from the image an check if it is white.

Upvotes: 5

Hawraa Khalil
Hawraa Khalil

Reputation: 261

i found a solution by myself: thanks all for replying:

private View.OnTouchListener imageViewOnClickListener = new View.OnTouchListener() {

    @Override
    public boolean onTouch(View view, MotionEvent event) {
        int x = (int) event.getX();

        if (173 <= x && x <= 671) {
            Intent intent = new Intent(context, NextActivity.class);
            context.startActivity(intent);
        }
        return true;
    }
};

Upvotes: 1

foxanna
foxanna

Reputation: 1570

I would advise to put another transparent control in your relative layout on top of ImageView with paddings you need, and subscribe to its onClick event. This way you can be sure only proper area was clicked.

Upvotes: 3

Related Questions