How to implement zoom effect for image view in android?

Question

I have to implement image zooming, I have tried with so many codes.But i didnt get full idea of gesture events. I want to implement when we apply double tap, image will be z

Answer 1

You could check the answer in a related question. https://stackoverflow.com/a/16894324/1465756

Just import library https://github.com/jasonpolites/gesture-imageview.

into your project and add the following in your layout file:

<LinearLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:gesture-image="http://schemas.polites.com/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent">

<com.polites.android.GestureImageView
   android:id="@+id/image"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:src="@drawable/image"
   gesture-image:min-scale="0.1"
   gesture-image:max-scale="10.0"
   gesture-image:strict="false"/>`

Answer 2

Lazy man can use this lib, Just import inside your project and

ImageView mImageView;
PhotoViewAttacher mAttacher;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // Any implementation of ImageView can be used!
    mImageView = (ImageView) findViewById(R.id.iv_photo);

    // Set the Drawable displayed
    Drawable bitmap = getResources().getDrawable(R.drawable.wallpaper);
    mImageView.setImageDrawable(bitmap);

    // Attach a PhotoViewAttacher, which takes care of all of the zooming functionality.
    mAttacher = new PhotoViewAttacher(mImageView);
}


// If you later call mImageView.setImageDrawable/setImageBitmap/setImageResource/etc then you just need to call
mAttacher.update();

Answer 3

Below is the code for ImageFullViewActivity Class

 public class ImageFullViewActivity extends AppCompatActivity {

        private ScaleGestureDetector mScaleGestureDetector;
        private float mScaleFactor = 1.0f;
        private ImageView mImageView;

        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.image_fullview);

            mImageView = (ImageView) findViewById(R.id.imageView);
            mScaleGestureDetector = new ScaleGestureDetector(this, new ScaleListener());

        }

        @Override
        public boolean onTouchEvent(MotionEvent motionEvent) {
            mScaleGestureDetector.onTouchEvent(motionEvent);
            return true;
        }

        private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
            @Override
            public boolean onScale(ScaleGestureDetector scaleGestureDetector) {
                mScaleFactor *= scaleGestureDetector.getScaleFactor();
                mScaleFactor = Math.max(0.1f,
                        Math.min(mScaleFactor, 10.0f));
                mImageView.setScaleX(mScaleFactor);
                mImageView.setScaleY(mScaleFactor);
                return true;
            }
        }
    }

Answer 4

I prefered the library davemorrissey/subsampling-scale-image-view over chrisbanes/PhotoView (answer of star18bit)

• Both are active projects (both have some commits in 2015)
• Both have a Demo on the PlayStore
• subsampling-scale-image-view supports large images (above 1080p) without memory exception due to sub sampling, which PhotoView doesn't support
• subsampling-scale-image-view seems to have larger API and better documentation

See How to convert AAR to JAR, if you like to use subsampling-scale-image-view with Eclipse/ADT

Answer 5

Here is one of the most efficient way, it works smoothly:

https://github.com/MikeOrtiz/TouchImageView

Place TouchImageView.java in your project. It can then be used the same as ImageView.

Example:

TouchImageView img = (TouchImageView) findViewById(R.id.img);

If you are using TouchImageView in xml, then you must provide the full package name, because it is a custom view.

Example:

    <com.example.touch.TouchImageView
            android:id="@+id/img”
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

Answer 6

Here is a great example on how to implement zoom affect on touch with a imageview

Zoom effect on imageview

EDIT:

Also here is another great one.

Pinch to zoom tutorial