当前位置: 代码迷 >> Android >> Android多点触控缩放拖拽范例
  详细解决方案

Android多点触控缩放拖拽范例

热度:63   发布时间:2016-04-28 03:08:38.0
Android多点触控缩放拖拽实例
在Android上查看图片或者浏览网页时,我们往往有把图片或者网页放大或者缩小的的需求,这样就能够获得更多的细节信息
或者获得更多的全貌信息,多点触摸与绽放功能正是满足这种应用场景的技术。

下面通过一个例子来学习实现图片的拖拉功能:

程序运行示意图:1.初始化界面  2.为缩小的界面  3.为放大的界面

          

新建一个名称为DragAndDrop的Android工程,目录结构如下:

主界面的activity_layout.xml的布局代码如下:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    >    <ImageView         android:id="@+id/show_img"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:scaleType="matrix"        android:src="@drawable/s001"        android:background="#ff0000"        android:contentDescription="@string/app_name"/></RelativeLayout>

读者需要注意的是我们的ImageView的控制方式设置成了matrix这样就可以在代码中非常方便的对图片进行控制了。

我们把一张图片(大小超过手机屏幕)的图片放在drawable-mdpi文件中。

图片资源如下:



MainActivity.java的代码如下:


package com.shen.draganddrop;import android.app.Activity;import android.graphics.Matrix;import android.graphics.PointF;import android.os.Bundle;import android.util.Log;import android.view.Menu;import android.view.MenuItem;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;	@Override	protected void onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		setContentView(R.layout.activity_main);		imageView = (ImageView) findViewById(R.id.show_img);		imageView.setOnTouchListener(new ImageTouchListener());	}	@Override	public boolean onCreateOptionsMenu(Menu menu) {		// Inflate the menu; this adds items to the action bar if it is present.		getMenuInflater().inflate(R.menu.main, menu);		return true;	}	@Override	public boolean onOptionsItemSelected(MenuItem item) {		// Handle action bar item clicks here. The action bar will		// automatically handle clicks on the Home/Up button, so long		// as you specify a parent activity in AndroidManifest.xml.		int id = item.getItemId();		if (id == R.id.action_settings) {			return true;		}		return super.onOptionsItemSelected(item);	}		private class ImageTouchListener implements OnTouchListener	{				//声明一个坐标点		private PointF startPoint;		//声明并实例化一个Matrix来控制图片		private Matrix matrix = new Matrix();		//声明并实例化当前图片的Matrix		private Matrix mCurrentMatrix = new Matrix();						//缩放时初始的距离		private float startDistance;		//拖拉的标记		private static final int DRAG = 1;		//缩放的标记		private static final int ZOOM = 2;		//标识记录		private int mode;		//缩放的中间点		private PointF midPoint;				@Override		public boolean onTouch(View v, MotionEvent event) {			switch (event.getAction()&MotionEvent.ACTION_MASK) {			case MotionEvent.ACTION_DOWN:				System.out.println("ACTION_DOWN");				Log.w("Drag", "ACTION_DOWN");				//此时处于拖拉方式下				mode = DRAG;				//获得当前按下点的坐标				startPoint = new PointF(event.getX(),event.getY());				//把当前图片的Matrix设置为按下图片的Matrix				mCurrentMatrix.set(imageView.getImageMatrix());				break;			case MotionEvent.ACTION_MOVE:				Log.w("Drag", "ACTION_MOVE");				//根据不同的模式执行相应的缩放或者拖拉操作				switch (mode) {				case DRAG:					//移动的x坐标的距离					float dx = event.getX() - startPoint.x;					//移动的y坐标的距离					float dy = event.getY() - startPoint.y;					//设置Matrix当前的matrix					matrix.set(mCurrentMatrix);					//告诉matrix要移动的x轴和Y轴的距离					matrix.postTranslate(dx, dy);					break;				case ZOOM:					//计算缩放的距离					float endDistance = distance(event);					//计算缩放比率					float scale = endDistance / startDistance;					//设置当前的Matrix					matrix.set(mCurrentMatrix);					//设置缩放的参数					matrix.postScale(scale, scale, midPoint.x, midPoint.y);					break;				default:					break;				}								break;			//已经有一个手指按住屏幕,再有一个手指按下屏幕就会触发该事件			case MotionEvent.ACTION_POINTER_DOWN:				Log.w("Drag", "ACTION_POINTER_DOWN");				//此时为缩放模式				mode = ZOOM;				//计算开始时两个点的距离				startDistance = distance(event);				//当两个点的距离大于10时才进行缩放操作				if(startDistance > 10)				{					//计算中间点					midPoint = mid(event);					//得到进行缩放操作之前,照片的绽放倍数					mCurrentMatrix.set(imageView.getImageMatrix());				}				break;			//已经有一个手指离开屏幕,还有手指在屏幕上时就会触发该事件			case MotionEvent.ACTION_POINTER_UP:				Log.w("Drag", "ACTION_POINTER_UP");				mode = 0;				break;			case MotionEvent.ACTION_UP:				Log.w("Drag", "ACTION_UP");				mode = 0;				break;			default:				break;			}			//按照Matrix的要求移动图片到某一个位置			imageView.setImageMatrix(matrix);			//返回true表明我们会消费该动作,不需要父控件进行进一步的处理			return true;		}					}		public static float distance(MotionEvent event)	{		float dx = event.getX(1) - event.getX(0);		float dy = event.getY(1) - event.getY(0);				return (float) Math.sqrt(dx*dx + dy*dy);	}		public static PointF mid(MotionEvent event)	{		float x = (event.getX(1) - event.getX(0)) /2;		float y = (event.getY(1) - event.getY(0)) /2;		return new PointF(x,y);	}}
代码中都有注释在此就不详述了!


程序源码下载

http://download.csdn.net/detail/cqtddt/8308631

  相关解决方案