Get touched coordinates on Image

[maxmousee]

Get where the user is touching in the image (x,y) with the image reference in any zoom?
Is it possible?

[MikeOrtiz]

I have private PointF variables "last" and "start" which track the points the raw user touch data. You can make a public method which returns either of these points. It doesn't make sense to add this to TouchImageView as I would like to keep the raw touch data abstracted away.

[sebastianwr]

For other people seeing this - to translate the touch event to the actual image coordinates you have to do some mathematical magic. I got this from StackOverflow. Set your activity/fragment as OnClickListener for the TouchImageView and implement onClick like this (mMapImageView is my TouchImageView stored as instance variable)

    @Override
    public void onClick(View v) {
        Ln.d("Clicked image on: " + mMapImageView.last.x + ", " + mMapImageView.last.y);
        Matrix m = new Matrix();
        mMapImageView.matrix.invert(m);
        float[] pts = {mMapImageView.last.x, mMapImageView.last.y };
        m.mapPoints(pts);
        Ln.d("Mapped to real image: " + pts[0] + ", " + pts[1]);        
    }

[sreekanth100khere]

Hi @sebastianwr, @MikeOrtiz
I wanted to detect touch event in a particular area, say a rectangle in the image, (even after zooming), could you guide me with respect to this?

[sebastianwr]

Actually, I switched to a WebView containing an image map. That was much easier to realize on Android for my special use case.

[MikeOrtiz]

@sreekanth100k First, you'll need to make a RectF of the bounds of your rectangle in the image. The coordinates of this RectF should range from 0 to 1. Next, you'll want to turn the method transformCoordTouchToBitmap from private to public.

image.setOnTouchListener(new OnTouchListener() {

    @Override
    public boolean onTouch(View v, MotionEvent ev) {
         // TODO: Filter which action types to recognize with ev.getActionMasked();
         PointF bitmapPoint = transformCoordTouchToBitmap(ev.getX(), ev.getY(), true);
         PointF normalizedBitmapPoint = new PointF(bitmapPoint.x / width, bitmapPoint.y / width);
         if (hitBoxRectF.contains(normalizedBitmapPoint.x, normalizedBitmapPoint.y) {
                // TODO: Do something here and then consume event
                return true;
         }
         return false;
    }
});

[sreekanth100khere]

Thanks a lot for the answers :)
I have one more question, When I zoom and then switch image, the zoom persists, how can I bring the zoom back to normal? What should be done inorder for this to be achieved?

[MikeOrtiz]

Call resetZoom()

[sreekanth100khere]

Thanks a lot Mike, Can I implement a swipe for the screen some how? I mean if I swipe the image should switch

[MikeOrtiz]

I just found this OnSwipeTouchListener: http://stackoverflow.com/questions/4139288/android-how-to-handle-right-to-left-swipe-gestures. You could set OnSwipeLeft() and OnSwipeRight() to switch the image. There could be some issues as TIV will want to fling the image and the Swipe Listener will try to switch the image, so you will need to work out what functionality you want here. Maybe just switch the image when getCurrentZoom() == 1.

[sreekanth100khere]

Ok I understand that :) Thanks a lot Mike :)

[sreekanth100khere]

Hi Mike,
I cannot find resetzooom in the touchimageview class. I am just using touchimageview class in my application

[MikeOrtiz]

Make sure you get the most updated code. I pushed v1.2 to master earlier this week.

[sreekanth100khere]

will the new version serve all the purposes that the old version served?

[MikeOrtiz]

A couple functions have been deprecated including transformCoordTouchToBitmap. But the method is still available privately. You'll need to make it public for your purposes.

[sreekanth100khere]

I am geting and error when I replaced the old version with the new one.
float[] pts = {mSwitcher.last.x, mSwitcher.last.y };
mSwitcher is my variable.
I get the error "last cannot be resolved or is not a field"

[MikeOrtiz]

Did you modify TouchImageView? If so, any changes you made to it must be ported to v1.2.

[sreekanth100khere]

Hi Mike,
Thanks a lot for all the help, every thing worked like a charm, the swipe also works well. Thanks a lot.

[sreekanth100khere]

Hi Mike,
I dont know whether this sounds weird, but I need to do this, I am loading many images in the Touch Image View, On some images I need to load some buttons on top of images, the buttons are dynamically fetched from the web and then detect the click on buttons. Do you have any clue on how to do this, or can this be done? Please let me know what you think.
Regards,
Sreekanth

[androidovshchik]

This worked for me

imageView.setOnTouchListener { _, event ->
    if (event.action != MotionEvent.ACTION_DOWN) {
        return@setOnTouchListener false
    }
    val transformCoordTouchToBitmap = main.javaClass.getDeclaredMethod("transformCoordTouchToBitmap",
        Float::class.java, Float::class.java, Boolean::class.java)
    transformCoordTouchToBitmap.isAccessible = true
    val bitmapPoint = transformCoordTouchToBitmap.invoke(imageView, event.x, event.y, true) as PointF
    return@setOnTouchListener false
}

bitmapPoint contains pixel coordinates of bitmap

[werohit]

This worked for me

imageView.setOnTouchListener { _, event ->
    if (event.action != MotionEvent.ACTION_DOWN) {
        return@setOnTouchListener false
    }
    val transformCoordTouchToBitmap = main.javaClass.getDeclaredMethod("transformCoordTouchToBitmap",
        Float::class.java, Float::class.java, Boolean::class.java)
    transformCoordTouchToBitmap.isAccessible = true
    val bitmapPoint = transformCoordTouchToBitmap.invoke(imageView, event.x, event.y, true) as PointF
    return@setOnTouchListener false
}

bitmapPoint contains pixel coordinates of bitmap

Worked for me as well, Thanks a ton bro

[hannesa2]

It it this, what you want ? #357

   binding.imageSingle.setOnTouchCoordinatesListener(object: OnTouchCoordinatesListener {
            override fun onTouchCoordinate(view: View, event: MotionEvent, bitmapPoint: PointF) {
                binding.touchCoordinates.text = "touch coordinates x=${bitmapPoint.x} y=${bitmapPoint.y}"
            }
        })

https://github.com/MikeOrtiz/TouchImageView/pull/357/files#diff-32a3a06a7b8d99f785c9fa83b959c286cb1c9a65da8f3af3d2892c3820973068R46-R50

[hannesa2]

@androidovshchik before you work with reflections, I recommend to make a pull request

[hannesa2]

A new release https://github.com/MikeOrtiz/TouchImageView/releases/tag/refs%2Ftags%2F3.1.0