English | 简体中文
A gesture-friendly and easy-to-use image pinch-zoom control. It extends ImageView
, is contained in a single class file, has no external dependencies, and is lightweight and easy to integrate.
- Integrated with ViewPlayer, preloads thumbnail images when the image is not on the current page, and switches to high-definition images when the page is in view.
- Transition animations between thumbnail and full-size image viewing modes.
- Loads extremely large images in segments.
- Long image browsing mode.
- Single-finger swipe
- Single-finger swipe inertia
- Swipe stops at the boundary
- Double-tap to zoom in and out
- When double-tapping to zoom in, the tap point is centered as much as possible
- Pinch-zoom with two fingers to enter zoom mode
- In zoom mode, the image can be moved
- In zoom mode, the image can be moved beyond the boundaries
- In zoom mode, the image can be zoomed in or out beyond the boundary size
- Exit zoom mode (all fingers lifted), and the image rebounds to the nearest appropriate position
- Compatible with ImageView API
- Supports image resolution switching
- Rectangular mask overlay
- Click and long-press events
- Listeners for image size and position changes
- Get current size and position
- Get current gesture state
- API to perform image zoom and move animations
- API to perform mask move and zoom animations
- Override to set the maximum zoom size for images
- Override to set the scale for zooming in or out after double-tap
1) Copy PinchImageView.java
into your project.
2) Add the following code to your layout file; it can already display an image from resources:
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.boycy815.pinchimageview.PinchImageView
android:id="@+id/pic"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/my_pic"/>
</RelativeLayout>
3) Use it directly as an ImageView
:
// Retrieve it as an ImageView
ImageView imageView = (ImageView) findViewById(R.id.pic);
// You can set the image using any method supported by ImageView
imageView.setImageResource(R.drawable.my_pic);
// or...
imageView.setImageBitmap(bitmap);
// or...
imageView.setImageDrawable(drawable);
// or you can even use third-party image loading libraries, like ImageLoader
imageLoader.displayImage("https://host.com/my_pic.jpg", imageView);