Android program to browse zoom drag and center images automatically

  • 2020-10-23 20:17:16
  • OfStack

This article describes the Android programming to achieve the image browsing, zooming, dragging and automatic center effect method. To share for your reference, the details are as follows:

Touch.java


/**
 *  Picture browsing, zooming, dragging, automatic center 
 */
public class Touch extends Activity implements OnTouchListener {
 Matrix matrix = new Matrix();
 Matrix savedMatrix = new Matrix();
 DisplayMetrics dm;
 ImageView imgView;
 Bitmap bitmap;
 float minScaleR;//  Minimum scale 
 static final float MAX_SCALE = 4f;//  Maximum scaling 
 static final int NONE = 0;//  The initial state 
 static final int DRAG = 1;//  Drag the 
 static final int ZOOM = 2;//  The zoom 
 int mode = NONE;
 PointF prev = new PointF();
 PointF mid = new PointF();
 float dist = 1f;
 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.scale);
  imgView = (ImageView) findViewById(R.id.imag);//  Access controls 
  bitmap = BitmapFactory.decodeResource(getResources(), this.getIntent()
    .getExtras().getInt("IMG"));//  Get image resources 
  imgView.setImageBitmap(bitmap);//  Fill in the control 
  imgView.setOnTouchListener(this);//  Set up touch monitor 
  dm = new DisplayMetrics();
  getWindowManager().getDefaultDisplay().getMetrics(dm);//  Acquired resolution 
  minZoom();
  center();
  imgView.setImageMatrix(matrix);
 }
 /**
  *  A touch screen monitor 
  */
 public boolean onTouch(View v, MotionEvent event) {
  switch (event.getAction() & MotionEvent.ACTION_MASK) {
  //  Press the main point 
  case MotionEvent.ACTION_DOWN:
   savedMatrix.set(matrix);
   prev.set(event.getX(), event.getY());
   mode = DRAG;
   break;
  //  Click the vice 
  case MotionEvent.ACTION_POINTER_DOWN:
   dist = spacing(event);
   //  If the distance between two consecutive points is greater than 10 , then it is judged as multi-point mode 
   if (spacing(event) > 10f) {
    savedMatrix.set(matrix);
    midPoint(mid, event);
    mode = ZOOM;
   }
   break;
  case MotionEvent.ACTION_UP:
  case MotionEvent.ACTION_POINTER_UP:
   mode = NONE;
   break;
  case MotionEvent.ACTION_MOVE:
   if (mode == DRAG) {
    matrix.set(savedMatrix);
    matrix.postTranslate(event.getX() - prev.x, event.getY()
      - prev.y);
   } else if (mode == ZOOM) {
    float newDist = spacing(event);
    if (newDist > 10f) {
     matrix.set(savedMatrix);
     float tScale = newDist / dist;
     matrix.postScale(tScale, tScale, mid.x, mid.y);
    }
   }
   break;
  }
  imgView.setImageMatrix(matrix);
  CheckView();
  return true;
 }
 /**
  *  Limit maximum and minimum scaling and center automatically 
  */
 private void CheckView() {
  float p[] = new float[9];
  matrix.getValues(p);
  if (mode == ZOOM) {
   if (p[0] < minScaleR) {
    matrix.setScale(minScaleR, minScaleR);
   }
   if (p[0] > MAX_SCALE) {
    matrix.set(savedMatrix);
   }
  }
  center();
 }
 /**
  *  Minimum scaling, maximum scaling 100%
  */
 private void minZoom() {
  minScaleR = Math.min(
    (float) dm.widthPixels / (float) bitmap.getWidth(),
    (float) dm.heightPixels / (float) bitmap.getHeight());
  if (minScaleR < 1.0) {
   matrix.postScale(minScaleR, minScaleR);
  }
 }
 private void center() {
  center(true, true);
 }
 /**
  *  Horizontal and vertical center 
  */
 protected void center(boolean horizontal, boolean vertical) {
  Matrix m = new Matrix();
  m.set(matrix);
  RectF rect = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());
  m.mapRect(rect);
  float height = rect.height();
  float width = rect.width();
  float deltaX = 0, deltaY = 0;
  if (vertical) {
   //  If the image is smaller than the screen size, it is displayed in the center. Larger than the screen, the top blank will move up, the bottom blank will move down 
   int screenHeight = dm.heightPixels;
   if (height < screenHeight) {
    deltaY = (screenHeight - height) / 2 - rect.top;
   } else if (rect.top > 0) {
    deltaY = -rect.top;
   } else if (rect.bottom < screenHeight) {
    deltaY = imgView.getHeight() - rect.bottom;
   }
  }
  if (horizontal) {
   int screenWidth = dm.widthPixels;
   if (width < screenWidth) {
    deltaX = (screenWidth - width) / 2 - rect.left;
   } else if (rect.left > 0) {
    deltaX = -rect.left;
   } else if (rect.right < screenWidth) {
    deltaX = screenWidth - rect.right;
   }
  }
  matrix.postTranslate(deltaX, deltaY);
 }
 /**
  *  Distance between two points 
  */
 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);
 }
 /**
  *  The midpoint of two points 
  */
 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);
 }
}

scale.xml


<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:layout_gravity="center" >
 <ImageView
  android:id="@+id/imag"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:layout_gravity="center"
  android:scaleType="matrix" >
 </ImageView>
</FrameLayout>

I hope this article has been helpful in Android programming.


Related articles: