Hi,
I have an application which zoom/pans the image within screen bounds. I have custom ImageView class inside my CustomFrameLayout as defined below.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/darker_gray" >
<com.example.panzoomapplication.panzoom.CustomFrameLayout
android:id="@+id/custom_frame_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<com.example.panzoomapplication.panzoom.CustomImageView
android:id="@+id/drawing_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawingCacheQuality="high"
android:layout_gravity="center"
android:src="@drawable/image"
android:adjustViewBounds="true" />
</com.example.panzoomapplication.panzoom.CustomFrameLayout>
</FrameLayout>
I am scaling canvas in CustomFrameLayout class using,
private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
@Override
public boolean onScale(ScaleGestureDetector detector) {
mScaleFactor *= detector.getScaleFactor();
// Don't let the object get too small or too large.
mScaleFactor = Math.max(MIN_ZOOM, Math.min(mScaleFactor, MAX_ZOOM));
calculatePanZoomMatrix();
return true;
}
}
private void calculatePanZoomMatrix() {
mPanZoomMatrix.reset();
// scale the view w.r.t to center of the canvas.
mPanZoomMatrix.setScale(mScaleFactor, mScaleFactor, getWidth() / 2, getHeight() / 2);
invalidate();
}
and in ondraw() of CustomFrameLayout,
@Override
protected void onDraw(Canvas canvas) {
canvas.concat(mPanZoomMatrix);
}
The canvas zooms well and takes correct touch position when mScalFactor = 1 (or in initial state). But when scaled by a factor greater than 1, the touch event coordinate shifts by a certain amount. I have tried to simulate this issue by drawing a circle at touch position in CustomImageView class.
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint paint = new Paint();
paint.setPathEffect(null);
paint.setStyle(Paint.Style.FILL_AND_STROKE);
paint.setColor(getResources().getColor(R.color.red));
if (mCirclePoint != null)
canvas.drawCircle(touchEvent.x, touchEvent.y, 6, paint);
}
The circle draws well at initial state of canvas (mScalFactor = 1), but shifts its position from actual touch point when scaled by a factor greater than 1. I have tried to fix this issue using matrix as follows,
public float[] getAbsolutePosition(float touchX, float touchY) {
float[] scaledPoints = new float[2];
scaledPoints[0] = touchX ;
scaledPoints[1] = touchY;
Matrix matrix = new Matrix();
matrix.reset();
foat scaleFactor = mCustomFrameLayout.getScaleFactor();
float centerX = mCustomFrameLayout.getCenterScaleX();
float centerY = mCustomFrameLayout.getCenterScaleY();
matrix.setScale(scaleFactor, scaleFactor, centerX, centerY);
matrix.mapPoints(scaledPoints);
return scaledPoints;
}
but end up with same problem.
Could you please help me to fix this issue? I have googled a lot but with no perfect solution.*