How to zoom at particular XY coordinate(points) in ImageView

Question

I have used this PhotoView library for custom ImageView. I want to scale the image at particular point. Here is the method I found is setScale(float scale, float focalX, float focalY, boolean animate)

I am wondering what can I pass a value of focalX and focalY , I have X and Y coordinate which I am passing currently and it scales to very different position.

Here is a snippet,

intResultX = intTotalX / intArraySize;
intResultY = intTotalY / intArraySize;
mMap.setScale(5, intResultX, intResultY, true);

`focalX` and `focalY` are relative offsets from your view's left-top corner — pskink, Jun 13 '17 at 17:57
@pskink I've checked this but my original XY position is far away from the view's left top corner while it scaled. — Kuls, Jun 13 '17 at 18:01
if you pass 0, 0 the scaling is done around your views left-top corner, if you pass getWidth()/2, getHeight()/2 the scaling is done around your view's center etc — pskink, Jun 13 '17 at 18:11
@pskink I believe you, Can you please tell me if I have X and Y coordinates then how can scale the image to the center where my X and Y coordinates are pointed ? — Kuls, Jun 13 '17 at 18:54
Center scaling is a cool thing to implement, you can solve it with two triangles and one rectangle — Marcos Vasconcelos, Jun 30 '17 at 20:47

score 1 · Answer 1 · answered Jan 01 '18 at 09:11

Set zoom to the specified scale. Image will be centered around the point (focusX, focusY). These floats range from 0 to 1 and denote the focus point as a fraction from the left and top of the view. For example, the top left corner of the image would be (0, 0). And the bottom right corner would be (1, 1).

public void setZoom(float scale, float focusX, float focusY, ScaleType scaleType) {

   /*setZoom can be called before the image is on the screen, but at this point,
   image and view sizes have not yet been calculated in onMeasure. Thus, we should
   delay calling setZoom until the view has been measured.*/

  if (!onDrawReady) {
     delayedZoomVariables = new ZoomVariables(scale, focusX, focusY, scaleType);
     return;
  }

  if (scaleType != mScaleType) {
     setScaleType(scaleType);
  }
  resetZoom();
  scaleImage(scale, viewWidth / 2, viewHeight / 2, true);
  matrix.getValues(m);
  m[Matrix.MTRANS_X] = -((focusX * getImageWidth()) - (viewWidth * 0.5f));
  m[Matrix.MTRANS_Y] = -((focusY * getImageHeight()) - (viewHeight * 0.5f));
  matrix.setValues(m);
  fixTrans();
  setImageMatrix(matrix);
}

Hope this helps. Happy coding.

score 1 · Accepted Answer · answered Jan 01 '18 at 14:01

To zoom at particular XY coordinate in Imageview you can pass a value of focalX and focalY along with scale (must be between max scale an min scale of PhotoView) and boolean value to set animation.

Code to get max-min scales:

mPhotoView.getMinimumScale();

mPhotoView.getMaximumScale();

focalX and focalY It can be any points on screen, here I have taken two examples one is center of the screen and other is top-left corner. following is the code for both cases.

Code:

Random r = new Random();
float minScale = mPhotoView.getMinimumScale();
float maxScale = mPhotoView.getMaximumScale();
float randomScale = minScale + (r.nextFloat() * (maxScale - minScale));

DisplayMetrics displayMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
int height = displayMetrics.heightPixels;
int width = displayMetrics.widthPixels;
int centerX=width/2;
int centerY =height/2;

/*pass a value of focalX and focalY to scale image to center*/
//mPhotoView.setScale(randomScale, centerX, centerY, true);

/*pass a value of focalX and focalY to scale image to top left corner*/
mPhotoView.setScale(randomScale, 0, 0, true);

but how to zoom(scale and move) to x,y coordinates of Bitmap? https://stackoverflow.com/questions/48961771/how-to-scale-photoview-to-x-y-coordinates-of-bitmap — NickUnuchek, Feb 24 '18 at 10:42
@Patrick R I only want to move image at x,y with current scale. How to do that ? — Abhay Koradiya, Nov 21 '18 at 13:08

How to zoom at particular XY coordinate(points) in ImageView

2 Answers2