How to get the coordinates (X and Y) of a click on an imageview?

Asked

Viewed 1,368 times

2

I’m making an application that has an image that occupies the whole ImageView, and when the user clicks at some point on that image, the X and Y coordinates corresponding to the image are obtained and a circle is drawn with center at that point. Whereas my image has the following size (and consequently ImageView, that by default on Android, has its size determined by the image dimensions):

imgView.width = (int) (screen_width * 0.8);
imgView.height = (int) (screen_heigh * 0.8);

Using the method of ImageView

imgView.setOnTouchListener(new OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        real_x = (float) (event.getX());
        real_y = (float) (event.getY());
        //desenhe um círculo com centro em Point(real_x,real_y) na imagem contida no imgView
    }
}

The problem is that event.getX() and event.getY() do not return the real coordinates, corresponding to the point clicked on the image. Thus a conversion is required, **but how to do this conversion in a way that is valid for any screen size?? **

java android android-layout image

2 answers

1


event.getX() and event.getY() return the coordinates relative to the upper left corner of the Imageview.
Like the dimensions of Imageview may be different from the image it contains, a conversion is required to obtain the corresponding coordinates relative to the image.

Assuming the image was assigned to Imageview through android:src the coordinates can be calculated as follows:: 

//Obter o Bitmap associado à ImageView 
Bitmap bitmap=((BitmapDrawable)imageView.getDrawable()).getBitmap();

//Obter as dimensões do Bitmap e da ImageView
double bitmapWidth = bitmap.getWidth();
double bitmapHeight = bitmap.getHeight();
double imageViewWidth = imageView.getWidth();
double imageViewHeight = imageView.getHeigth();

//calcular a razão entre as dimensões do Bitmap e da ImageView
double ratioX = bitmapWidth / imageViewWidht;
double ratioY = bitmapHeight / imageViewHeight;

//Aplicar a razão às coordenadas
int bitmapX = (int)(x * ratioX);
int bitmapY = (int)(y * ratioY);

Where x and y are the coordinates obtained from event.getX() and event.getY();

  • Thank you for your attention! Since the size of the imageView will be the same as the bitmap inserted in it through android:src, What is the need to convert between bitmap size and image view size ? ratioX and ratioY will not be 1?

  • Yes and in this case the coordinates you are looking for are the ones returned by event.getX() and event.getY();. So I don’t understand what you mean by "Event.getx() and Event.gety() do not return the actual coordinates"

  • How is it "that the size of the imageView will be the same as the bitmap inserted in it" if the size of Imageview is adjusted to 80% of the screen size?

  • Aren’t you confusing real coordinates with absolute coordinates? Real coordinates are relative to the Bitmap, absolute coordinates are relative to the screen and relative coordinates are relative to the Imageview

  • So I need to resize my bitmap to bitamp.width = (int) (screen_width * 0.8); bitmap.height = (int) (screen_heigh * 0.8);

  • how the imageView adapts to the size of the src, if for example src was a 320x240 image, if I do LayoutParams params = (LayoutParams) imageView.getLayoutParams(); params.widht and params.height would have to be 320 and 240 respectively, but return -1 and -1. For it to work normally, these values have to have the actual size of the image, since it works normally when I do params.width=320; params.height=240; imageView.setLayoutParams(params);

  • If you have both layout params as wrap_content to Imageview the real size of the image but nay can get it on onCreate() see this question, however in the method onTouch() should already be available. I still haven’t figured out what kind of coordinates you want to get, whether they are real, absolute or relative.

  • Thank you. Finally I got it, the problem was that imageview was starting with different image dimensions. What I did was, first of all, load the image in an array (Mat() - with Opencv) with custom sizes (80% of the screen) and after that, pass the dimensions to the imageview.

Show 3 more comments

0

Also try to get the coordinates from the top left corner of your image, so you will have the exact reference:

int[] viewCoords = new int[2];
imgView.getLocationOnScreen(viewCoords);

And then, in the onTouch:

real_x = event.getX() - viewCoords[0];
real_y = event.getY() - viewCoords[1];

Browser other questions tagged java android android-layout image

You are not signed in. Login or sign up in order to post.