Android Pinch to increase ImageView

Question

I have one ImageView Layout image.

 import android.app.Activity; import android.os.Bundle; public class americanfootball extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.americanfootball); } } 

How to enable a simple pinch to enlarge the image?

Answer 1

For this you need to use your own ImageView. use something like this:

 import android.content.Context; import android.graphics.Canvas; import android.graphics.drawable.BitmapDrawable; import android.util.AttributeSet; import android.util.Log; import android.view.MotionEvent; import android.view.ScaleGestureDetector; import android.view.View; public class PinchImageView extends View { private static final int INVALID_POINTER_ID = -1; private Drawable mImage; private float mPosX; private float mPosY; private float mLastTouchX; private float mLastTouchY; private int mActivePointerId = INVALID_POINTER_ID; private ScaleGestureDetector mScaleDetector; private float mScaleFactor = 1.f; public PinchImageView(Context context) { this(context, null, 0); mImage=act.getResources().getDrawable(context.getResources().getIdentifier("imagename", "drawable", "packagename")); mImage.setBounds(0, 0, mImage.getIntrinsicWidth(), mImage.getIntrinsicHeight()); } public PinchImageView(Context context, AttributeSet attrs) { this(context, attrs, 0); } public PinchImageView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); mScaleDetector = new ScaleGestureDetector(context, new ScaleListener()); } @Override public boolean onTouchEvent(MotionEvent ev) { // Let the ScaleGestureDetector inspect all events. mScaleDetector.onTouchEvent(ev); final int action = ev.getAction(); switch (action & MotionEvent.ACTION_MASK) { case MotionEvent.ACTION_DOWN: { final float x = ev.getX(); final float y = ev.getY(); mLastTouchX = x; mLastTouchY = y; mActivePointerId = ev.getPointerId(0); break; } case MotionEvent.ACTION_MOVE: { final int pointerIndex = ev.findPointerIndex(mActivePointerId); final float x = ev.getX(pointerIndex); final float y = ev.getY(pointerIndex); // Only move if the ScaleGestureDetector isn't processing a gesture. if (!mScaleDetector.isInProgress()) { final float dx = x - mLastTouchX; final float dy = y - mLastTouchY; mPosX += dx; mPosY += dy; invalidate(); } mLastTouchX = x; mLastTouchY = y; break; } case MotionEvent.ACTION_UP: { mActivePointerId = INVALID_POINTER_ID; break; } case MotionEvent.ACTION_CANCEL: { mActivePointerId = INVALID_POINTER_ID; break; } case MotionEvent.ACTION_POINTER_UP: { final int pointerIndex = (ev.getAction() & MotionEvent.ACTION_POINTER_INDEX_MASK) >> MotionEvent.ACTION_POINTER_INDEX_SHIFT; final int pointerId = ev.getPointerId(pointerIndex); if (pointerId == mActivePointerId) { // This was our active pointer going up. Choose a new // active pointer and adjust accordingly. final int newPointerIndex = pointerIndex == 0 ? 1 : 0; mLastTouchX = ev.getX(newPointerIndex); mLastTouchY = ev.getY(newPointerIndex); mActivePointerId = ev.getPointerId(newPointerIndex); } break; } } return true; } @Override public void onDraw(Canvas canvas) { super.onDraw(canvas); canvas.save(); Log.d("DEBUG", "X: "+mPosX+" Y: "+mPosY); canvas.translate(mPosX, mPosY); canvas.scale(mScaleFactor, mScaleFactor); mImage.draw(canvas); canvas.restore(); } 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(0.1f, Math.min(mScaleFactor, 10.0f)); invalidate(); return true; } } } 

Answer 2

Instead of creating a custom ImageView, try this open source library: https://github.com/martinwithaar/PinchToZoom

It does not extend the ImageView class, so you can also use other implementations of ImageView. He also has some really smooth IMHO animations.

Answer 3

You can see the link below:

https://androidcookbook.com/Recipe.seam?recipeId=2273

Note:

This is the biggest pinch to enlarge (and move) the example I have ever discovered!

• add android: scaleType = "matrix" to your ImageView in an XML file.

Example:

 <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" app:srcCompat="@drawable/menu2" android:id="@+id/imageView7"android:scaleType="matrix" /> 

2. copy code and paste into your activity

Remember to change the code below to your own image. "ImageView view = (ImageView) findViewById (R.id.imageView);"