Android手势滑动实现ImageView缩放图片大小

本文推出了两种Android手势实现ImageView缩放图片大小的方法,分享给大家供大家参考,具体内容如下

方法一:
将以下代码写到MulitPointTouchListener.java中,然后对你相应的图片进行OnTouchListener。
例如:imageView.setOnTouchListener(new MulitPointTouchListener ());
在xml中要将ImageView的缩放格式改成Matrix
例如:android:scaleType="matrix"
这样就可以实现图片的缩放了
下面是MulitPointTouchListener.java代码:

public class MulitPointTouchListener implements OnTouchListener {
    private static final String TAG = "Touch";
    // These matrices will be used to move and zoom image
    Matrix matrix = new Matrix();
    Matrix savedMatrix = new Matrix();  

    // We can be in one of these 3 states
    static final int NONE = 0;
    static final int DRAG = 1;
    static final int ZOOM = 2;
    int mode = NONE;  

    // Remember some things for zooming
    PointF start = new PointF();
    PointF mid = new PointF();
    float oldDist = 1f;  

    @Override
    public boolean onTouch(View v, MotionEvent event) {  

        ImageView view = (ImageView) v;
        // Log.e("view_width",
        // view.getImageMatrix()..toString()+"*"+v.getWidth());
        // Dump touch event to log
        dumpEvent(event);  

        // Handle touch events here...
        switch (event.getAction() & MotionEvent.ACTION_MASK) {
        case MotionEvent.ACTION_DOWN:  

            matrix.set(view.getImageMatrix());
            savedMatrix.set(matrix);
            start.set(event.getX(), event.getY());
            //Log.d(TAG, "mode=DRAG");
            mode = DRAG;  

            //Log.d(TAG, "mode=NONE");
            break;
        case MotionEvent.ACTION_POINTER_DOWN:
            oldDist = spacing(event);
            //Log.d(TAG, "oldDist=" + oldDist);
            if (oldDist > 10f) {
                savedMatrix.set(matrix);
                midPoint(mid, event);
                mode = ZOOM;
                //Log.d(TAG, "mode=ZOOM");
            }
            break;
        case MotionEvent.ACTION_UP:
        case MotionEvent.ACTION_POINTER_UP:
            mode = NONE;
            //Log.e("view.getWidth", view.getWidth() + "");
            //Log.e("view.getHeight", view.getHeight() + "");  

            break;
        case MotionEvent.ACTION_MOVE:
            if (mode == DRAG) {
                // ...
                matrix.set(savedMatrix);
                matrix.postTranslate(event.getX() - start.x, event.getY()
                        - start.y);
            } else if (mode == ZOOM) {
                float newDist = spacing(event);
                //Log.d(TAG, "newDist=" + newDist);
                if (newDist > 10f) {
                    matrix.set(savedMatrix);
                    float scale = newDist / oldDist;
                    matrix.postScale(scale, scale, mid.x, mid.y);
                }
            }
            break;
        }  

        view.setImageMatrix(matrix);
        return true; // indicate event was handled
    }  

    private void dumpEvent(MotionEvent event) {
        String names[] = { "DOWN", "UP", "MOVE", "CANCEL", "OUTSIDE",
                "POINTER_DOWN", "POINTER_UP", "7?", "8?", "9?" };
        StringBuilder sb = new StringBuilder();
        int action = event.getAction();
        int actionCode = action & MotionEvent.ACTION_MASK;
        sb.append("event ACTION_").append(names[actionCode]);
        if (actionCode == MotionEvent.ACTION_POINTER_DOWN
                || actionCode == MotionEvent.ACTION_POINTER_UP) {
            sb.append("(pid ").append(
                    action >> MotionEvent.ACTION_POINTER_ID_SHIFT);
            sb.append(")");
        }
        sb.append("[");
        for (int i = 0; i < event.getPointerCount(); i++) {
            sb.append("#").append(i);
            sb.append("(pid ").append(event.getPointerId(i));
            sb.append(")=").append((int) event.getX(i));
            sb.append(",").append((int) event.getY(i));
            if (i + 1 < event.getPointerCount())
                sb.append(";");
        }
        sb.append("]");
        //Log.d(TAG, sb.toString());
    }  

    private float spacing(MotionEvent event) {
        float x = event.getX(0) - event.getX(1);
        float y = event.getY(0) - event.getY(1);
        return FloatMath.sqrt(x * x + y * y);
    }  

    private void midPoint(PointF point, MotionEvent event) {
        float x = event.getX(0) + event.getX(1);
        float y = event.getY(0) + event.getY(1);
        point.set(x / 2, y / 2);
    }
} 

方法二:自定义一个ImageView,例如TouchImageView:

import android.content.Context;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.ScaleGestureDetector;
import android.view.View;
import android.widget.ImageView;

public class TouchImageView extends ImageView {

  Matrix matrix;

  // We can be in one of these 3 states
  static final int NONE = 0;
  static final int DRAG = 1;
  static final int ZOOM = 2;
  int mode = NONE;

  // Remember some things for zooming
  PointF last = new PointF();
  PointF start = new PointF();
  float minScale = 1f;
  float maxScale = 3f;
  float[] m;

  int viewWidth, viewHeight;
  static final int CLICK = 3;
  float saveScale = 1f;
  protected float origWidth, origHeight;
  int oldMeasuredWidth, oldMeasuredHeight;

  ScaleGestureDetector mScaleDetector;

  Context context;

  public TouchImageView(Context context) {
    super(context);
    sharedConstructing(context);
  }

  public TouchImageView(Context context, AttributeSet attrs) {
    super(context, attrs);
    sharedConstructing(context);
  }

  private void sharedConstructing(Context context) {
    super.setClickable(true);
    this.context = context;
    mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());
    matrix = new Matrix();
    m = new float[9];
    setImageMatrix(matrix);
    setScaleType(ScaleType.MATRIX);

    setOnTouchListener(new OnTouchListener() {

      @Override
      public boolean onTouch(View v, MotionEvent event) {
        mScaleDetector.onTouchEvent(event);
        PointF curr = new PointF(event.getX(), event.getY());

        switch (event.getAction()) {
          case MotionEvent.ACTION_DOWN:
           last.set(curr);
            start.set(last);
            mode = DRAG;
            break;

          case MotionEvent.ACTION_MOVE:
            if (mode == DRAG) {
              float deltaX = curr.x - last.x;
              float deltaY = curr.y - last.y;
              float fixTransX = getFixDragTrans(deltaX, viewWidth, origWidth * saveScale);
              float fixTransY = getFixDragTrans(deltaY, viewHeight, origHeight * saveScale);
              matrix.postTranslate(fixTransX, fixTransY);
              fixTrans();
              last.set(curr.x, curr.y);
            }
            break;

          case MotionEvent.ACTION_UP:
            mode = NONE;
            int xDiff = (int) Math.abs(curr.x - start.x);
            int yDiff = (int) Math.abs(curr.y - start.y);
            if (xDiff < CLICK && yDiff < CLICK)
              performClick();
            break;

          case MotionEvent.ACTION_POINTER_UP:
            mode = NONE;
            break;
        }

        setImageMatrix(matrix);
        invalidate();
        return true; // indicate event was handled
      }

    });
  }

  public void setMaxZoom(float x) {
    maxScale = x;
  }

  private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
    @Override
    public boolean onScaleBegin(ScaleGestureDetector detector) {
      mode = ZOOM;
      return true;
    }

    @Override
    public boolean onScale(ScaleGestureDetector detector) {
      float mScaleFactor = detector.getScaleFactor();
      float origScale = saveScale;
      saveScale *= mScaleFactor;
      if (saveScale > maxScale) {
        saveScale = maxScale;
        mScaleFactor = maxScale / origScale;
      } else if (saveScale < minScale) {
        saveScale = minScale;
        mScaleFactor = minScale / origScale;
      }

      if (origWidth * saveScale <= viewWidth || origHeight * saveScale <= viewHeight)
        matrix.postScale(mScaleFactor, mScaleFactor, viewWidth / 2, viewHeight / 2);
      else
        matrix.postScale(mScaleFactor, mScaleFactor, detector.getFocusX(), detector.getFocusY());

      fixTrans();
      return true;
    }
  }

  void fixTrans() {
    matrix.getValues(m);
    float transX = m[Matrix.MTRANS_X];
    float transY = m[Matrix.MTRANS_Y];

    float fixTransX = getFixTrans(transX, viewWidth, origWidth * saveScale);
    float fixTransY = getFixTrans(transY, viewHeight, origHeight * saveScale);

    if (fixTransX != 0 || fixTransY != 0)
      matrix.postTranslate(fixTransX, fixTransY);
  }

  float getFixTrans(float trans, float viewSize, float contentSize) {
    float minTrans, maxTrans;

    if (contentSize <= viewSize) {
      minTrans = 0;
      maxTrans = viewSize - contentSize;
    } else {
      minTrans = viewSize - contentSize;
      maxTrans = 0;
    }

    if (trans < minTrans)
      return -trans + minTrans;
    if (trans > maxTrans)
      return -trans + maxTrans;
    return 0;
  }

  float getFixDragTrans(float delta, float viewSize, float contentSize) {
    if (contentSize <= viewSize) {
      return 0;
    }
    return delta;
  }

  @Override
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    viewWidth = MeasureSpec.getSize(widthMeasureSpec);
    viewHeight = MeasureSpec.getSize(heightMeasureSpec);

    //
    // Rescales image on rotation
    //
    if (oldMeasuredHeight == viewWidth && oldMeasuredHeight == viewHeight
        || viewWidth == 0 || viewHeight == 0)
      return;
    oldMeasuredHeight = viewHeight;
    oldMeasuredWidth = viewWidth;

    if (saveScale == 1) {
      //Fit to screen.
      float scale;

      Drawable drawable = getDrawable();
      if (drawable == null || drawable.getIntrinsicWidth() == 0 || drawable.getIntrinsicHeight() == 0)
        return;
      int bmWidth = drawable.getIntrinsicWidth();
      int bmHeight = drawable.getIntrinsicHeight();

      Log.d("bmSize", "bmWidth: " + bmWidth + " bmHeight : " + bmHeight);

      float scaleX = (float) viewWidth / (float) bmWidth;
      float scaleY = (float) viewHeight / (float) bmHeight;
      scale = Math.min(scaleX, scaleY);
      matrix.setScale(scale, scale);

      // Center the image
      float redundantYSpace = (float) viewHeight - (scale * (float) bmHeight);
      float redundantXSpace = (float) viewWidth - (scale * (float) bmWidth);
      redundantYSpace /= (float) 2;
      redundantXSpace /= (float) 2;

      matrix.postTranslate(redundantXSpace, redundantYSpace);

      origWidth = viewWidth - 2 * redundantXSpace;
      origHeight = viewHeight - 2 * redundantYSpace;
      setImageMatrix(matrix);
    }
    fixTrans();
  }
}

然后在我们的Activity中就可以直接使用了:

public class TouchImageViewActivity extends Activity {
  /** Called when the activity is first created. */
  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    TouchImageView img = (TouchImageView) findViewById(R.id.snoop);
    img.setImageResource(R.drawable.snoopy);
    img.setMaxZoom(4f);
  }
}
(0)

相关推荐

  • android中view手势滑动冲突的解决方法

    Android手势事件的冲突跟点击事件的分发过程息息相关,由三个重要的方法来共同完成,分别是:dispatchTouchEvent.onInterceptTouchEvent和onTouchEvent. public boolean dispatchTouchEvent(MotionEvent ev) 这个方法用来进行事件的分发.如果事件传递到view,那么这个方法一定会被调用,返回结果受当前View的onTouchEvent和下级View的dispatchTouchEvent方法的影响,表示是

  • Android实现手势滑动多点触摸缩放平移图片效果

    现在app中,图片预览功能肯定是少不了的,用户基本已经形成条件反射,看到小图,点击看大图,看到大图两个手指开始进行放大,放大后,开始移动到指定部位. 一.概述 想要做到图片支持多点触控,自由的进行缩放.平移,需要了解几个知识点:Matrix , GestureDetector , ScaleGestureDetector 以及事件分发机制,ps:不会咋办,不会你懂的. 1.Matrix 矩阵,看深入了都是3维矩阵的乘啊什么的,怪麻烦的~~ 其实这么了解下就行了: Matrix 数据结构:3维矩阵

  • Android开发之实现手势滑动的功能

    Android开发之实现手势滑动的功能 首先得Activity必须实现OnGestureListener接口,该接口提供了关于手势操作的一些方法, onDown方法:onDown是,一旦触摸屏按下,就马上产生onDown事件 public boolean onDown(MotionEvent e) { return false; } onFling方法:当手在屏幕上滑动但手未离开屏幕时触发 MotionEvent e1 手开始触碰屏幕的位置的MotionEvent对象 MotionEvent e

  • Android实现手势滑动识别功能

    对于Android中的手势识别可以从以下三个Listener入手--OnTouchListener.OnGestureListener.OnDoubleTapListener.这三个监听器分别是触摸监听.手势滑动监听和屏幕双击操作监听.很多的时候我们需要这些手势识别的操作,例如我们自定义控件的时候就经常会用到.下面就对这三个监听器分别进行介绍. 触摸监听器OnTouchListener 让我们的Activity去现实此接口,并重写onTouch方法.重写OnTouchListener的onTou

  • Android实现手势滑动多点触摸缩放平移图片效果(二)

    上一篇已经带大家实现了自由的放大缩小图片,简单介绍了下Matrix:具体请参考:Android实现手势滑动多点触摸缩放平移图片效果,本篇继续完善我们的ImageView. 首先加入放大后的移动. 1.自由的进行移动 我们在onTouchEvent里面,加上移动的代码,当然了,必须长或宽大于屏幕才可以移动~~~ @Override public boolean onTouch(View v, MotionEvent event) { mScaleGestureDetector.onTouchEve

  • Android自定义View实现随手势滑动控件

    本文控件为大家分享了Android随手势滑动控件的具体代码,供大家参考,具体内容如下 1.新建自定义控件类:MyView public class MyView extends Button{ //记录上次滑动后的坐标值 private int lastX; private int lastY; public MyView(Context context) { super(context); // TODO Auto-generated constructor stub } public MyV

  • Android手势滑动实现两点触摸缩放图片

    学习安卓手势滑动,多点触摸放大缩小图片,分享给大家供大家参考,具体代码如下 1.布局文件如下main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" andr

  • Android实现手势滑动多点触摸放大缩小图片效果

    网上文章虽多,但是这种效果少之又少,我真诚的献上以供大家参考 实现原理:自定义ImageView对此控件进行相应的layout(动态布局). 这里你要明白几个方法执行的流程: 首先ImageView是继承自View的子类. onLayout方法:是一个回调方法.该方法会在在View中的layout方法中执行,在执行layout方法前面会首先执行setFrame方法. setFrame方法:判断我们的View是否发生变化,如果发生变化,那么将最新的l,t,r,b传递给View,然后刷新进行动态更新

  • Android实现手势滑动和简单动画效果

    一.手势滑动 1.Activity都具有响应触摸事件,也就是说只要触摸Activity,他都会回调一个onTouchEvent()方法.但是在这个方法里无法处理事件,需要配合使用手势识别器(GestureDetector)中的方法onTouchEvent对事件(event)进行分析处理,我们只需要重写这个方法中的操作来达到我们的需求. /** * activity被触摸后,会回调此方法onTouchEvent,并回传一个event对象 * event对象封装了触摸时的动作信息,包括x.y坐标等等

  • Android GestureDetector手势滑动使用实例讲解

    Gesture在 ViewGroup中使用 GestureDetector类可以让我们快速的处理手势事件,如点击,滑动等. 使用GestureDetector分三步: 1. 定义GestureDetector类 2. 初始化手势类,同时设置手势监听 3. 将touch事件交给gesture处理 先来了解一下如何使用,后面会有示例: package com.example.y2222.myview; import android.content.Context; import android.ut

随机推荐