Android实现手指触控图片缩放功能

这次记录的是实现Android图片两手触控缩放的功能。

编译环境:eclipse
Android版本4.0

创建工程过程略

实现图片在页面两手触控缩放

原理图---图片缩放

两手拉开图片变大,两手合拢图片缩小,根据两手的移动距离来判断图片放大和缩小的倍数,两手的移动距离计算方法如下:

两手不管是正着还是斜着拉伸,用勾股定理都能计算出两点的距离。

除此之外,还要确定两个手位置的中心点,图片以这个中心点为参照进行放大和缩小:

计算两点之间的中心点的方法是,点1距原点位置X1(或者Y1)加上点2距原点位置X2(或者Y2),和除以2即可:
X0=(X1+X2)/2; Y0=(Y1+Y2)/2;

实现图片在页面内的触控缩放(还有拖拉功能,是以前写的)
main.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  tools:context="com.example.dragscale.MainActivity" > 

  <!--scaleType="matrix"采用矩阵来实现图片的拖拉和放大-->
  <ImageView
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:src="@drawable/keep"
    android:scaleType="matrix"
    android:id="@+id/image"/> 

</LinearLayout>

MainActivity.java:

package com.example.dragscale; 

import android.app.Activity;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.os.Bundle;
import android.util.FloatMath;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.ImageView; 

public class MainActivity extends Activity {
 private ImageView imageView;
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main); 

 imageView=(ImageView)this.findViewById(R.id.image);
    //添加触摸监听对象(控件被触摸就会触发TouchListener类)
 imageView.setOnTouchListener(new TouchListener());
 } 

 private final class TouchListener implements OnTouchListener{
 private PointF startPoint= new PointF();//PointF(浮点对)
 private Matrix matrix=new Matrix();//矩阵对象
 private Matrix currentMatrix=new Matrix();//存放照片当前的矩阵
 private int mode=0;//确定是放大还是缩小
 private static final int DRAG=1;//拖拉模式
 private static final int ZOOM=2;//缩放模式
 private float startDis;//开始距离
 private PointF midPoint;//中心点 

 //参数1:用户触摸的控件;参数2:用户触摸所产生的事件
 public boolean onTouch(View v, MotionEvent event) {
  //判断事件的类型
  //得到低八位才能获取动作,所以要屏蔽高八位(通过与运算&255)
  //ACTION_MASK就是一个常量,代表255
  switch (event.getAction()&MotionEvent.ACTION_MASK) {
  case MotionEvent.ACTION_DOWN://手指下压
  mode=DRAG;
  currentMatrix.set(imageView.getImageMatrix());//记录ImageView当前的移动位置
  startPoint.set(event.getX(), event.getY());
  break;
  case MotionEvent.ACTION_MOVE://手指在屏幕移动,改事件会不断被调用
  if(mode==DRAG){//拖拉模式
   float dx=event.getX()-startPoint.x;//得到在x轴的移动距离
   float dy=event.getY()-startPoint.y;//得到在y轴的移动距离
   matrix.set(currentMatrix);//在没有进行移动之前的位置基础上进行移动
   //实现位置的移动
   matrix.postTranslate(dx, dy);
  }else if(mode==ZOOM){//缩放模式
   float endDis=distance(event);//结束距离
   if(endDis>10f){//防止不规则手指触碰
    //结束距离除以开始距离得到缩放倍数
    float scale=endDis/startDis;
    //通过矩阵实现缩放
    //参数:1.2.指定在xy轴的放大倍数;3,4以哪个参考点进行缩放
    //开始的参考点以两个触摸点的中心为准
    matrix.set(currentMatrix);//在没有进行缩放之前的基础上进行缩放
    matrix.postScale(scale,scale,midPoint.x,midPoint.y);
   } 

  } 

  break;
  case MotionEvent.ACTION_UP://手指离开屏幕
  case MotionEvent.ACTION_POINTER_UP://当屏幕上已经有手指离开屏幕,屏幕上还有一个手指,就会触发这个事件
  mode=0;
  break;
  case MotionEvent.ACTION_POINTER_DOWN://当屏幕上已经有触点(手指),再有一个手指按下屏幕,就会触发这个事件
  mode=ZOOM;
  startDis=distance(event);
  if(startDis>10f){//防止不规则手指触碰
   midPoint=mid(event);
   currentMatrix.set(imageView.getImageMatrix());//记录ImageView当前的缩放倍数
  }
  break; 

  default:
  break;
  }
  //将imageView的矩阵位置改变
  imageView.setImageMatrix(matrix);
  return true;
 } 

 }
 //计算两点之间的距离(勾股定理)
 public float distance(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);
 } 

 //计算两个点的中心点
 public static PointF mid(MotionEvent event){
  float midx=(event.getX(1)+event.getX(0))/2;
  float midy=(event.getY(1)+event.getY(0))/2;
  return new PointF(midx,midy);
 }
}

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

您可能感兴趣的文章:

  • android 多点触摸图片缩放的具体实现方法
  • Android实现多点触控,自由缩放图片的实例代码
  • Android多点触控实现图片自由缩放
  • Android多点触控技术实战 针对图片自由缩放和移动
  • Android单点触控实现图片平移、缩放、旋转功能
  • Android多点触控实现对图片放大缩小平移,惯性滑动等功能
  • Android实现手势滑动多点触摸缩放平移图片效果(二)
  • Android实现手势滑动多点触摸缩放平移图片效果
  • Android实现手势滑动多点触摸放大缩小图片效果
  • Android手势滑动实现两点触摸缩放图片
(0)

相关推荐

  • android 多点触摸图片缩放的具体实现方法

    布局: 复制代码 代码如下: <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/relativeLayout1"    android:layout_width="fill_parent

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

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

  • 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实现手势滑动多点触摸缩放平移图片效果

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

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

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

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

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

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

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

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

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

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

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

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

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

随机推荐