Android之关于手势操作图片的缩放与移动
jopen
12年前
在Android中实现手势对于图片的操作,首先需要对MotionEvent以及Matrix两个类有所了解实现对手势的识别以及图片变动的操作。
在实现该功能时候需要在xml中要将图片的缩放格式改成Matrix才行.
下面代码主要实现两个demo,一个是关于matrix的简单测试以及图片的手势缩放与移动demo.。。
XML代码如下:
<?xml version="1.0" encoding="UTF-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_height="fill_parent" android:layout_width="fill_parent" android:id="@+id/linearLayout1" android:weightSum="1"> <ImageView android:layout_width="wrap_content" android:id="@+id/imag" android:layout_height="wrap_content" android:src="@drawable/a" android:layout_gravity="center" android:scaleType="matrix" ></ImageView> <ImageView android:layout_width="wrap_content" android:id="@+id/imag1" android:scaleType="matrix" android:layout_height="wrap_content"></ImageView> </LinearLayout>
实现代码: package hfut.gmm; import android.app.Activity; import android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Matrix; import android.graphics.Paint; import android.graphics.PointF; import android.os.Bundle; import android.util.DisplayMetrics; import android.util.FloatMath; import android.util.Log; import android.view.GestureDetector; import android.view.MotionEvent; import android.view.View; import android.view.GestureDetector.OnGestureListener; import android.view.View.OnTouchListener; import android.view.animation.AnimationUtils; import android.widget.ImageView; public class Img_control extends Activity implements OnTouchListener {//implements OnTouchListener { private ImageView imgview; private ImageView img; private Matrix matrix=new Matrix(); private Matrix savedMatrix=new Matrix(); 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; //private GestureDetector gesture; @Override protected void onCreate(Bundle savedInstanceState) { // TODO Auto-generated method stub super.onCreate(savedInstanceState); this.setContentView(R.layout.img_control); imgview=(ImageView)this.findViewById(R.id.imag1); imgview.setAnimation(AnimationUtils.loadAnimation(this, R.anim.newanim)); img=(ImageView)this.findViewById(R.id.imag); Matrix mt=img.getImageMatrix(); //mt.postRotate(30); mt.postScale(0.5f,0.5f);mt.postScale(1.5f,1.5f); mt.postRotate(30, 130, 100); mt.postTranslate(100, 10); img.setImageMatrix(mt); //imgview.setLongClickable(true); imgview.setImageBitmap(BitmapFactory.decodeResource(this.getResources(), R.drawable.a)); imgview.setOnTouchListener(this); imgview.setLongClickable(true); } 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); } @Override public boolean onTouch(View v, MotionEvent event) { // TODO Auto-generated method stub /* Log.d("Infor", "类别:"+event.getAction()); Log.d("Infor", "mask:"+event.getActionMasked()); Log.d("Infor", "index:"+event.getActionIndex()); Log.d("Infor", "points:"+event.getPointerCount());*/ Log.d("Infor", "size:"+event.getSize()); if(event.getActionMasked()==MotionEvent.ACTION_POINTER_UP) Log.d("Infor", "多点操作"); switch(event.getActionMasked()){ case MotionEvent.ACTION_DOWN: matrix.set(imgview.getImageMatrix()); savedMatrix.set(matrix); start.set(event.getX(),event.getY()); Log.d("Infor", "触摸了..."); mode=DRAG; break; case MotionEvent.ACTION_POINTER_DOWN: //多点触控 oldDist=this.spacing(event); if(oldDist>10f){ Log.d("Infor", "oldDist"+oldDist); savedMatrix.set(matrix); midPoint(mid,event); mode=ZOOM; } break; case MotionEvent.ACTION_POINTER_UP: mode=NONE; 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); if(newDist>10){ matrix.set(savedMatrix); float scale=newDist/oldDist; matrix.postScale(scale, scale, mid.x, mid.y); } } break; } imgview.setImageMatrix(matrix); return false; } }
运行结果如下: