Imageview not following finger touch

Question

I want to build an app that has an imageview and it simply follows the finger touch. In other words, the imageview follows the touch of the finger. I have partially achieved this, in the sense that the imageview is following the touch of the finger but the problem is that it is at some offset. The imageview is about an inch down the actual touch.

Below is my code:

public class MainActivity extends AppCompatActivity {

ImageView img;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    img = (ImageView)findViewById(R.id.img1);
    img.setImageResource(R.drawable.ic_remove_circle_black_24dp);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
    img.setX(event.getX());
    img.setY(event.getY());
    return false;
}

}

What could be the reason behind the offset?

Edit: Solution

Following code does what I need:

public class MainActivity extends AppCompatActivity {

    ImageView img;
    int[] viewCoords = new int[2];

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        img = (ImageView)findViewById(R.id.img1);
        img.setImageResource(R.drawable.ic_remove_circle_black_24dp);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event){
        img.getLocationOnScreen(viewCoords);
        img.setX(event.getX()-(viewCoords[0]-img.getX()));
        img.setY(event.getY()-(viewCoords[1]-img.getY()));
        return true;

    }
}

Thanks to Doomsknight for the direction.

score 0 · Answer 1 · answered Jun 05 '17 at 12:41

0

From what I can see, you are using the X and Y coordinates of the touch event of the Screen.

And then drawing this coordinates on the X and Y of the ImageView.

This will cause the offset you are seeing, as they do not match up, as the imageview probably isnt at the very top of your screen.

What I think you are trying to do is get the X and Y, of the actual image. You will therefore need to offset the coordinates accordingly.

There is a good example of this already of getting the offset, and removing it: see link below.

https://stackoverflow.com/a/11312423/940834

You can get the top left corner of your view as follows:
 int[] viewCoords = new int[2];
 imageView.getLocationOnScreen(viewCoords); 
From this and the touch coordinates you can calculate the point inside the ImageView:
 int touchX = (int) event.getX(); 
 int touchY = (int) event.getY();

 int imageX = touchX - viewCoords[0]; // viewCoords[0] is the X coordinate 
 int imageY = touchY - viewCoords[1]; // viewCoords[1] is the y coordinate

answered Jun 05 '17 at 12:41

IAmGroot

13,760
18
84
154

After executing int[] viewCoords = new int[2]; imageView.getLocationOnScreen(viewCoords); the value in viewCoords is {0,0}. So, effectively, it does not do anything. – Ankit Shubham Jun 05 '17 at 16:29
@ankitshubham. You have the reason for the offset in the answer above. If that particular implementation is not working I suggest looking for another on the internet now that you have a place to start. – IAmGroot Jun 05 '17 at 20:22
@ankitshubham. Also I recommend putting this code in the ontouch method. Not the oncreate method. It may help as inflation should have occurred – IAmGroot Jun 05 '17 at 20:24
Seems like I did solve my problem. Following logic did the trick: img.setX(event.getX()-(viewCoords[0]-img.getX())); img.setY(event.getY()-(viewCoords[1]-img.getY())); – Ankit Shubham Jun 06 '17 at 06:29

Imageview not following finger touch

1 Answers1