Android ImageView移動和縮放

要實現ImageView的縮放就要使用到我們大學裏面學習的線代裏面的矩陣（Matrix）,我們看一下源碼就可以知道

    public static final int MSCALE_X = 0;   //!< use with getValues/setValues
    public static final int MSKEW_X  = 1;   //!< use with getValues/setValues
    public static final int MTRANS_X = 2;   //!< use with getValues/setValues
    public static final int MSKEW_Y  = 3;   //!< use with getValues/setValues
    public static final int MSCALE_Y = 4;   //!< use with getValues/setValues
    public static final int MTRANS_Y = 5;   //!< use with getValues/setValues
    public static final int MPERSP_0 = 6;   //!< use with getValues/setValues
    public static final int MPERSP_1 = 7;   //!< use with getValues/setValues
    public static final int MPERSP_2 = 8;   //!< use with getValues/setValues
 @Override
    public String toString() {
        StringBuilder sb = new StringBuilder(64);
        sb.append("Matrix{");
        toShortString(sb);
        sb.append('}');
        return sb.toString();

    }
public void toShortString(StringBuilder sb) {
        float[] values = new float[9];
        getValues(values);
        sb.append('[');
        sb.append(values[0]); sb.append(", "); sb.append(values[1]); sb.append(", ");
        sb.append(values[2]); sb.append("][");
        sb.append(values[3]); sb.append(", "); sb.append(values[4]); sb.append(", ");
        sb.append(values[5]); sb.append("][");
        sb.append(values[6]); sb.append(", "); sb.append(values[7]); sb.append(", ");
        sb.append(values[8]); sb.append(']');
    }

這其實就是一個3*3的矩陣，然後我們就可以知道具體的座標屬性爲
{MSCALE_X,MSKEW_X,MTRANS_X,
MSKEW_Y, MSCALE_Y,MTRANS_Y,
MPERSP_0,MPERSP_1,MPERSP_2}
其中 MSCALE_X和MSCALE_Y分別是控制X軸和Y軸方向的縮放，MSKEW_X和MSKEW_Y分別是控制X座標和Y座標的線性傾斜係數，MTRANS_X和MTRANS_Y分別是控制X方向和Y方向的線性平移。MPERSP_0、MPERSP_1和MPERSP_2是關於透視的，我們這裏使用不到也就不做解釋了。
這個矩陣其實也是一個默認的單位矩陣，單位矩陣爲

E=（1，0，0
    0，1，0
    0，0，1）

也就是在默認的情況下我們的矩陣對ImageView的縮放、平移是保持着默認的狀態的。當我們的手指在屏幕上面移動的時候，所謂的單位矩陣裏面的座標值就會發生變化。
先看一下效果圖：

我們這次要實現的是關於圖片的移動與縮放。但是圖片的縮放是要有限制的，圖片既不能無限的縮小更不能無限的放大，那麼我們就需要對圖片的放大和縮小進行限制了。怎麼限制呢？我剛剛已經說了，當我們的手指在屏幕上面移動時，矩陣座標值就會發生變化。那麼我們就可以根據MSCALE_X和MSCALE_Y來對X和Y的座標值進行一個限制。
怎麼獲取獲取的大小呢？我們可以通過獲取縮放後的圖片大小來獲取MSCALE_X和和MSCALE_Y的值。

img_test.post(new Runnable(){
    @Override
    public void run() {

    //獲得圖片的真實寬高，
    int drawableWidth = img_test.getDrawable().getBounds().width();
    int drawableHeight = img_test.getDrawable().getBounds().height();

    //獲得變換矩陣以後的圖片
    Matrix matrix = img_test.getImageMatrix();
    float[] values = new float[9];
    matrix.getValues(values);

    //獲取變化矩陣中的MSCALE_X和MSCALE_Y的值
    float scaleX = values[0];
    float scaleY = values[4];
    }
    });

獲取到MSCALE_X和MSCALE_Y變化的值以後我們就可以根據變化的值做相應的判斷。
如果我們的圖片特別大以至於寬或高已經超出了屏幕的寬或高，我們又想要顯示出來的效果的寬或高正好是屏幕的寬或高。我們可以獲取圖片的真實的寬和高，然後屏幕的寬和高，最後用圖片的真是寬或高/屏幕的寬或高進行縮放
獲取屏幕的分辨率
DisplayMetrics displayMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
要想獲取圖片的真是高度，我們就要先獲取資源圖片
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.test);
剩下的就是獲取縮放的比例了
float defaultScale = Math.min(
((float) displayMetrics.widthPixels / (float) bitmap.getWidth()),
((float) displayMetrics.heightPixels / (float) bitmap.getHeight()));
下面我們開始進行圖片的縮放，就需要處理觸摸事件了。代碼裏面已經做了詳細的註釋就不再解釋了。

package com.lyxrobert.imagezoom;

import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.graphics.RectF;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;

public class ImageViewZoomAty extends Activity implements View.OnTouchListener {
    Matrix matrix = new Matrix();
    Matrix savedMatrix = new Matrix();
    DisplayMetrics displayMetrics;
    ImageView img_test;
    Bitmap bitmap;

    float defaultScale ;// 最小縮放比例
    static final int NONE = 0;// 初始狀態
    static final int DRAG = 1;// 拖動狀態
    static final int ZOOM = 2;// 縮放狀態
    int mode = NONE;
    PointF pointF = new PointF();
    PointF mid = new PointF();
    float scaleX = 0;
    float scaleY = 0;
    float dist = 1f;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        img_test = (ImageView) findViewById(R.id.img_test);// 獲取控件
        bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.test);// 獲取圖片資源
        img_test.setImageBitmap(bitmap);// 填充控件
        img_test.setOnTouchListener(this);// 設置觸屏監聽
        displayMetrics = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);// 獲取分辨率

        defaulZoom();
        center(true,true);
        img_test.setImageMatrix(matrix);
    }
    /**
     * 觸屏監聽
     */
    public boolean onTouch(View v, MotionEvent event) {

        switch (event.getAction() & MotionEvent.ACTION_MASK) {
            // 單指按下
            case MotionEvent.ACTION_DOWN:
                savedMatrix.set(matrix);
                pointF.set(event.getX(), event.getY());
                mode = DRAG;
                break;
            //另外的手指按下
            case MotionEvent.ACTION_POINTER_DOWN:
                dist = space2Point(event);
                // 如果連續獲取的兩點之間的距離大於10f說明是多點觸摸模式
                if (space2Point(event) > 10f) {
                    savedMatrix.set(matrix);
                    midPoint(mid, event);
                    mode = ZOOM;
                }
                break;
            case MotionEvent.ACTION_UP:
            case MotionEvent.ACTION_POINTER_UP:
                mode = NONE;
                break;
            case MotionEvent.ACTION_MOVE:
                if (mode == DRAG) {
                    matrix.set(savedMatrix);
                    matrix.postTranslate(event.getX() - pointF.x, event.getY()
                            - pointF.y);
                } else if (mode == ZOOM) {
                    float moveDistance = space2Point(event);
                    if (moveDistance > 10f) {
                        img_test.post(new Runnable(){
                            @Override
                            public void run() {
                                //獲得圖片的變換矩陣
                                Matrix m = img_test.getImageMatrix();
                                float[] values = new float[9];
                                m.getValues(values);
                                //獲取變化矩陣中的MSCALE_X和MSCALE_Y的值
                                scaleX = values[0];
                                scaleY = values[4];
                                if (scaleX<0.8f){
                                    mode = NONE;
                                    float minScale =0.81f/scaleX;
                                    matrix.postScale(minScale, minScale, mid.x, mid.y);
                                }else if(scaleX>2.5f){
                                    mode = NONE;
                                    float maxScale =2.5f/scaleX;
                                    matrix.postScale(maxScale, maxScale, mid.x, mid.y);
                                }
                            }});
                        matrix.set(savedMatrix);
                        float tScale = moveDistance / dist;
                        matrix.postScale(tScale, tScale, mid.x, mid.y);
                    }
                }
                break;
        }
        img_test.setImageMatrix(matrix);
        center(true,true);
        return true;
    }


    /**
     * 爲了適應屏幕的寬或高，需要做適度的縮放
     */
    private void defaulZoom() {
        defaultScale = Math.min(
                ((float) displayMetrics.widthPixels / (float) bitmap.getWidth()),
                ((float) displayMetrics.heightPixels / (float) bitmap.getHeight()));
        matrix.postScale(defaultScale, defaultScale);
    }


    /**
     * 讓圖片居中顯示
     */
    protected void center(boolean isHorizontal, boolean isVertical) {

        Matrix m = new Matrix();
        m.set(matrix);
        //設置的圖片顯示的位置在左上角
        RectF rect = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());
        m.mapRect(rect);

        float height = rect.height();
        float width = rect.width();

        float deltaX = 0, deltaY = 0;

        if (isVertical) {
            int screenHeight = displayMetrics.heightPixels;
            if (height < screenHeight) {
                //如果圖片的高度小於屏幕的高度，那麼就要向下移動圖片，因爲上面的rect設置的圖片默認顯示在左上角
                deltaY = (screenHeight - height) / 2 - rect.top;
            } else if (rect.top > 0) {
                //說明圖片的高度大於屏幕的高度並且上面留有空白需要上移
                deltaY = -rect.top;
            } else if (rect.bottom < screenHeight) {
                //說明圖片的高度大於屏幕的高度並且下面留有空白需要下移
                deltaY = img_test.getHeight() - rect.bottom;
            }
        }

        if (isHorizontal) {
            int screenWidth = displayMetrics.widthPixels;
            if (width < screenWidth) {
                //如果圖片的寬度小於屏幕的寬度，那麼就要右移動圖片，因爲上面的rect設置的圖片默認顯示在左上角
                deltaX = (screenWidth - width) / 2 - rect.left;
            } else if (rect.left > 0) {
                //說明圖片的寬度大於屏幕的寬度並且左邊留有空白需要右移
                deltaX = -rect.left;
            } else if (rect.right < screenWidth) {
                //說明圖片的寬度大於屏幕的寬度並且右邊留有空白需要左移
                deltaX = screenWidth - rect.right;
            }
        }
        matrix.postTranslate(deltaX, deltaY);
    }

    /**
     * 兩點的距離
     */
    float distanceX;
    float distanceY;
    private float space2Point(MotionEvent event) {
        try {
            distanceX = event.getX(0) - event.getX(1);
            distanceY = event.getY(0) - event.getY(1);
            return (float) Math.sqrt(distanceX * distanceX + distanceY * distanceY);
        }catch (Exception e){
        }
        return (float) Math.sqrt(distanceX * distanceX+ distanceY * distanceY);
    }
    /**
     * 兩點的中點
     */
    private void midPoint(PointF point, MotionEvent event) {
        float midX = event.getX(0) + event.getX(1);
        float midY = event.getY(0) + event.getY(1);
        point.set(midX / 2, midY / 2);
    }

}

佈局文件activity_main

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    >
    <ImageView android:layout_width="match_parent"
        android:id="@+id/img_test"
        android:scaleType="matrix"
        android:src="@drawable/test"
        android:layout_height="match_parent">
    </ImageView>
</LinearLayout>

點擊下載源碼