Android实现多点触控,自由缩放图片的实例代码

Android多点触控涉及到的知识点

1、ScaleGestureDetector

2、OnScaleGestureListener

3、Matrix

4、OnTouchListener

四个知识点需要了解一下,需要注意的是Matrix在内存中是一个一维数组,操控图片的Matrxi是一个3X3的矩阵,在内存中也就是一个大小为9的一维数组。

实现多点触控,自由变化图片

1、 ImageView的基础上继承

2、因为要在图片加载完成就获取到相关的属性,所以实现OnGlobalLayoutListener接口,并实现方法onGlobalLayout

注册OnGlobalLayoutListener接口:

 @Override
protected void onAttachedToWindow() {
 super.onAttachedToWindow();
 //注册 OnGlobalLayoutListener
 getViewTreeObserver().addOnGlobalLayoutListener(this);
}

@Override
protected void onDetachedFromWindow() {
 super.onDetachedFromWindow();
 //注销 OnGlobalLayoutListener
 getViewTreeObserver().removeOnGlobalLayoutListener(this);
}

实现onGlobalLayout方法

 @Override
public void onGlobalLayout() {
 //因为要在加载完成的时候就获取到图片的宽高 然后让图片的宽高去适应控件的宽高大小 isOnce只在第一次加载到时候处理
 if (isOnce) {
  //下一步3 获取相关属性 并做处理
  isOnce = false;
 }
}

3、

//获取控件的宽高
 int width = getWidth();
  int height = getHeight();
  //获取图片
  Drawable drawable = getDrawable();
  if (null == drawable) {
   return;
  }
  //获取到图片的宽高 **根据drawable的这两个方法获取
  int dw = drawable.getIntrinsicWidth();
  int dh = drawable.getIntrinsicHeight();

//定义一个图片缩放值
 float scale = 1.0f;

接下来就是根据图片的宽和高 控件的宽和高 去设置这个scale值

 //当图片的宽大于了控件的宽 图片的高小于控件的高
if (dw > width && dh < height) {
  scale = width * 1.0f / dw;
 }
 //当图片的宽小于了控件的宽 图片的高大于控件的高
if (dw < width && dh > height) {
  scale = height * 1.0f / dh;
 }

if ((dw > width && dh > height) || (dw < width && dh < height)) {
 scale = Math.min((width * 1.0f / dw), (height * 1.0f / dh));
}

//初始化三个缩放的值
  mInitScale = scale;//正常情况下的 缩放值
  mMidScale = scale * 2; //
  mMaxScale = scale * 4;//最大的缩放值 

//将图片初始化加载到控件的正中心位置
  //计算横纵需要移动的偏移值
  float dx = getWidth() / 2f - dw / 2f;
  float dy = getHeight() / 2f - dh / 2f;
  //使用矩阵控制图片的平移和缩放
  mMatrix.postTranslate(dx, dy);
  //缩放的时候要指定缩放基准点
  mMatrix.postScale(mInitScale, mInitScale, getWidth() / 2f, getHeight() / 2f);
  //通过设置Matrix改变ImageView
  setImageMatrix(mMatrix);

4、接下来就是ScaleGestureDetector

//初始化 this是OnScaleGestureListener 对象
 mScaleGestureDetector = new ScaleGestureDetector(context, this);
  //要通过ScaleGestureDetector去操控触摸事件,那还要实现OnTouchListener接口并实现onTouch方法,在该方法中将触摸事件传递给mScaleGestureDetector 对象。

@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
 //将触摸事件传递给ScaleGesture
 mScaleGestureDetector.onTouchEvent(motionEvent);
 return true;
}
 //设置监听
 setOnTouchListener(this);

5、OnScaleGestureListener 中的重要方法了

 //使用ScaleGestureListener去实现多点触控
@Override
public boolean onScale(ScaleGestureDetector scaleGestureDetector) {
 if (null == getDrawable()) {
  return true;
 }
//下一步6 处理

return true;
}

6、

 //缩放中
 //获取当前图片缩放scale
 float scale = getCurrentScale();

 //获取缩放因子
 float scaleFactor = scaleGestureDetector.getScaleFactor();
 //缩放值达到最大和最小的情况 scaleFactor>1表示正在放大 <1表示正在缩小
 if ((scale < mMaxScale && scaleFactor > 1.0f) || scale > mInitScale && scaleFactor < 1.0f) {
  if (scale * scaleFactor < mInitScale) {
   scaleFactor = mInitScale / scale;
  } else if (scale * scaleFactor > mMaxScale) {
   scaleFactor = mMaxScale / scale;
  }
 }

 //根据缩放因子去设置图片的缩放 根据多点的中心去缩放 scaleGestureDetector.getFocusX(), scaleGestureDetector.getFocusY()缩放中心点一定是手指触摸的中心点

  mMatrix.postScale(scaleFactor, scaleFactor, scaleGestureDetector.getFocusX(), scaleGestureDetector.getFocusY());

 //因为缩放的中心点会改变 所以要控制图片的边界处理*** 如果不处理,中心点会根据你手指位置的不同发生改变,那么图片位置会错乱
 checkoutBounds(); //下一步 7
 setImageMatrix(mMatrix);

7、checkoutBounds()

 private void checkoutBounds() {
 //通过矩阵要获取到缩放后图片的大小和坐标
 Drawable drawable = getDrawable();
 if (null != drawable) {
  RectF rectF = getScaleMatrix(drawable); //下一步 8

  //获取控件的宽高
  int width = getWidth();
  int height = getHeight();
  //声明 x y偏移值 如果偏离了控件需要移动回去
  float detalX = 0;
  float detalY = 0;

  if (rectF.width() >= width) {
   //图片的宽大于等于了控件的宽,为了让宽留白边,计算出应该左右移动的偏移值
   if (0 < rectF.left) {
    //左边留空白了 那就应该像左移动
    detalX = -rectF.left;
   } else if (rectF.right < width) {
    detalX = width - rectF.right;
   }
  }
  //高度控制
  if (rectF.height() >= height) {
   if (0 < rectF.top) {
    detalY = -rectF.top;
   } else if (rectF.bottom < height) {
    detalY = height - rectF.bottom;
   }
  }

  //图片宽和高小于控件宽高的情况,让图片居中显示
  if (rectF.width() < width) {
   //计算偏移值
   detalX = width / 2f - rectF.right + rectF.width() / 2f;
  }

  if (rectF.height() < height) {
   detalY = height / 2f - rectF.bottom + rectF.height() / 2f;
  }
  mMatrix.postTranslate(detalX, detalY);
}

8、getScaleMatrix(drawable) 该方法其他地方也可以效仿

//通过矩阵 去获取到缩放后的图片的四个顶点坐标
public RectF getScaleMatrix(Drawable drawable) {
 Matrix matrix = mMatrix;
 //图片的四个点坐标
 RectF rectF = new RectF(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
 matrix.mapRect(rectF);
 return rectF;
}

通过该控件可以熟悉一下多点触控的实现 和图形矩阵的知识

Demo地址:ZoomImageView

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android触屏测试实例代码

    本文实例详细描述了Android触屏测试代码,可实现对触屏的点击.移动.离开等事件的处理,对于Android初学者有很好的借鉴价值. 具体功能代码如下: package com.test; import android.app.Activity; import android.os.Bundle; import android.util.DisplayMetrics; import android.util.Log; import android.view.MotionEvent; import

  • Android开发实例之多点触控程序

    智能终端设备的多点触控操作为我们带来了种种炫酷体验,这也使得很多Android开发者都对多点触控程序的开发感兴趣.实际上多点触控程序的实现并不是那么遥不可及,而是比较容易.本文就主要通过一个实例具体讲解多点触控程序的实现.        首先来了解一下Android中多点触控的原理. Android多点触控在本质上需要LCD驱动和程序本身设计上支持,目前市面上HTC.Motorola和Samsung等知名厂商只要使用电容屏触控原理的手机均可以支持多点触控Multitouch技术,对于网页缩放.手

  • Android 通过触摸动态地在屏幕上画矩形效果

    需求概述: 在屏幕上用手指画出一个区域,返回所圈的区域坐标. 技术实现: 自定义View,设置画笔及对应参数,在onTouchEvent()回调函数里,对触摸事件进行判断.画出矩形图形. 代码: 自定义View: public class GameView extends View { // 声明Paint对象 private Paint mPaint = null; private int StrokeWidth = 5; private Rect rect = new Rect(0,0,0,

  • Android单点触控实现图片平移、缩放、旋转功能

    相信大家使用多点对图片进行缩放,平移的操作很熟悉了,大部分大图的浏览都具有此功能,有些app还可以对图片进行旋转操作,QQ的大图浏览就可以对图片进行旋转操作,大家都知道对图片进行缩放,平移,旋转等操作可以使用Matrix来实现,Matrix就是一个3X3的矩阵,对图片的处理可分为四个基础变换操作,Translate(平移变换).Rotate(旋转变换).Scale (缩放变换).Skew(错切变换),如果大家对Matrix不太了解的话可以看看这篇文章(点击查看),作者对每一种Matrix的变换写

  • Android编程实现两点触控功能示例

    本文实例讲述了Android编程实现两点触控功能.分享给大家供大家参考,具体如下: 下面是一个两点触控的案例代码: package com.zzj; import android.app.Activity; import android.os.Bundle; import android.view.MotionEvent; public class AndroidTestActivity extends Activity { private float x0, y0; private float

  • Android多点触控技术实战 针对图片自由缩放和移动

    在上一篇文章中我带着大家一起实现了Android瀑布流照片墙的效果,虽然这种效果很炫很酷,但其实还只能算是一个半成品,因为照片墙中所有的图片都是只能看不能点的.因此本篇文章中,我们就来对这一功能进行完善,加入点击图片就能浏览大图的功能,并且在浏览大图的时候还可以通过多点触控的方式对图片进行缩放. 如果你还没有看过 Android瀑布流照片墙实现,体验不规则排列的美感 这篇文章,请尽量先去阅读完再来看本篇文章,因为这次的代码完全是在上次的基础上进行开发的. 那我们现在就开始动手吧,首先打开上次的P

  • Android多点触控实现图片自由缩放

    Android多点触控涉及到的知识点 1.ScaleGestureDetector 2.OnScaleGestureListener 3.Matrix 4.OnTouchListener 四个知识点需要了解一下,需要注意的是Matrix在内存中是一个一维数组,操控图片的Matrxi是一个3X3的矩阵,在内存中也就是一个大小为9的一维数组. 实现多点触控,自由变化图片 1. ImageView的基础上继承 2.因为要在图片加载完成就获取到相关的属性,所以实现OnGlobalLayoutListen

  • Android应用开发中触摸屏手势识别的实现方法解析

    很多时候,利用触摸屏的Fling.Scroll等Gesture(手势)操作来操作会使得应用程序的用户体验大大提升,比如用Scroll手势在 浏览器中滚屏,用Fling在阅读器中翻页等.在Android系统中,手势的识别是通过 GestureDetector.OnGestureListener接口来实现的,不过William翻遍了Android的官方文档也没有找到一个相 关的例子,API Demo中的TouchPaint也仅仅是提到了onTouch事件的处理,没有涉及到手势. 我们先来明确一些概念

  • Android多点触控实现对图片放大缩小平移,惯性滑动等功能

    文章将在原有基础之上做了一些扩展功能: 1.图片的惯性滑动 2.图片缩放小于正常比例时,松手会自动回弹成正常比例 3.图片缩放大于最大比例时,松手会自动回弹成最大比例 实现图片的缩放,平移,双击缩放等基本功能的代码如下,每一行代码我都做了详细的注释 public class ZoomImageView extends ImageView implements ScaleGestureDetector.OnScaleGestureListener, View.OnTouchListener , V

  • android 触屏的震动响应接口调用方法

    调用native 方法来开启和关闭vibrator: native static void vibratorOn(long milliseconds); native static void vibratorOff(); 调用方法如下: VibratorService.vibratorOn()

随机推荐