Android图片查看器(图片可移动、缩放)

要实现图片在手指点击后移动和缩放有好几种方法，在这里是通过onTouch来实现的。

实例代码如下：

首先是在View中有一个ImageView

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin"

tools:context=".MainActivity" >

android:id="@+id/iv"

android:scaleType="matrix"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:src="@drawable/b" />

然后为ImageView设置onTouch点击事件

iv.setOnTouchListener(this);

重写onTouch

private PointF startPoint = new PointF();// 获取图片的原始坐标

// 设置触摸模式

private int mode = 0, single = 1, multi = 2;// 设置点击的模式，是单点触摸还是多点

private Matrix matrix = new Matrix();

private Matrix currentMatrix = new Matrix();

private float startDistance; // 两点开始的距离

private PointF midPoint; // 两点的中心位置

@Override

public boolean onTouch(View v, MotionEvent event) {

switch (event.getAction() & MotionEvent.ACTION_MASK) {

case MotionEvent.ACTION_DOWN:// 表示用户开始触摸

mode = single;

currentMatrix.set(iv.getImageMatrix());

startPoint.set(event.getX(), event.getY());

break;

case MotionEvent.ACTION_POINTER_DOWN:// 当屏幕上已经有触点(手指)，又有一个手指按下屏幕

mode = multi;

startDistance = getDistance(event);

getMidPoint(event);

currentMatrix.set(iv.getImageMatrix());

midPoint = getMidPoint(event);

break;

case MotionEvent.ACTION_MOVE:// 手指在屏幕上移动，该事件会不断触发

if (mode == single) {

float x = event.getX() - startPoint.x;

float y = event.getY() - startPoint.y;

matrix.set(currentMatrix);

matrix.postTranslate(x, y);

} else if (mode == multi) {

float endDistance = getDistance(event);

if (endDistance > 10f) {

float sclace = endDistance / startDistance;

matrix.set(currentMatrix);

matrix.postScale(sclace, sclace, midPoint.x, midPoint.y);

}

}

break;

case MotionEvent.ACTION_UP:// 手指离开屏幕

case MotionEvent.ACTION_POINTER_UP:// 当一个手指离开屏幕，但在屏幕上还有触点。

mode = 0;

break;

default:

break;

}

iv.setImageMatrix(matrix);

return true;

}

在这里mode用来判断当前是哪种触摸方式single代表单指操作用来移动图片，multi代表双指操作，用来做图片缩放处理。

移动图片：

currentMatrix代表点击时图片的当前位置

startPoint是点击时图片的坐标点

matrix.set(currentMatrix);matrix.postTranslate(x, y);

先获取图片的位置然后进行平移操作，平移的距离是手指移动的距离。

图片缩放：

由于图片的缩放要用两个手指来实现，所以要用到MotionEvent.ACTION_POINTER_DOWN

startDistance是开始按下时两个手指间的距离，

midPoint是按下时两点间的中心，

matrix.postScale(sclace, sclace, midPoint.x, midPoint.y);这几个参数表示X轴和y轴缩放的比例，和以那个坐标点开始缩放。

下面是getMidPoint和getDistance

private PointF getMidPoint(MotionEvent event) {

float midx=(event.getX(0)+event.getX(1))/2;

float midy=(event.getY(0)+event.getY(1))/2;

return new PointF(midx, midy);

}

private float getDistance(MotionEvent event) {

float dx=event.getX(1)-event.getX(0);

float dy=event.getY(1)-event.getY(0);

return FloatMath.sqrt(dx*dx+dy*dy);

}