Android implements ImageView picture scaling and dragging _android

Today we're going to write a imageview of scaling effects that a lot of people on the web are talking about. But a lot of people are using the library files directly,

So what we're doing today is directly coding a drag and zoom ImageView, specifically looking at the effect chart

So easy to analyze. What do you want to use to scale pictures and drag on your phone? Finger right

So what events on the control are related to the phone. View.ontouchlistener right.

OK, so create a new class first
···
public class Basedragzoomimageview extends ImageView implements View.ontouchlistener
···

Yes, inherit ImageView and add View.ontouchlistener events

And then we look at the constructor

  Public Basedragzoomimageview (context, AttributeSet attrs, int defstyle)
  {
    Super (context, attrs, Defstyle);
    Setontouchlistener (this);
  }

  Public Basedragzoomimageview (context, AttributeSet attrs)
  {This
    (context, attrs, 0);
    Setontouchlistener (this);
  }

  Public Basedragzoomimageview {This (context
    , null);
    Setontouchlistener (this);
  }

Yes, in the constructor, we set the Setontouchlistener.
So what exactly does this setontouchlistener do. Let's analyze the Motionevent in Ontouch first.
We all know that there are a lot of finger operations, so andorid naturally also put this situation in a number of cases.
-Motionevent.action_down Finger Press the screen
-Motionevent.action_move fingers moving on the screen
-Motionevent.action_up finger off screen
-Motionevent.action_pointer_up when the contact leaves the screen, but there are contacts (fingers) on the screen.
-Motionevent.action_pointer_down when there is already a contact (finger) on the screen, another contact presses the screen.

Obviously, it all seems to work.

  public boolean Ontouch (View V, motionevent event) {/** retains the last eight bits motionevent.action_mask = 255/switch (EV Ent.getaction () & Motionevent.action_mask) {//Finger press down screen case MotionEvent.ACTION_DOWN:mode = mode_d
        RAG;
        Record ImageView The current moving position currentmatrix.set (Getimagematrix ());
        Startpoint.set (Event.getx (), event.gety ());
      Break  The finger moves on the screen, the change event will be constantly triggered case motionevent.action_move://Drag picture if (mode = = Mode_drag) {float DX = Event.getx ()-startpoint.x; The moving distance of the x-axis is obtained from the float dy = event.gety ()-startpoint.y;
          To get the moving distance of the x-axis//Move the Matrix.set (Currentmatrix) before the position is not moved;
        Matrix.posttranslate (dx, dy); //Zoom Out picture Else if (mode = = Mode_zoom) {Float Enddis = distance (event);//end distance if (E Nddis > 10f) {//two fingers together when the pixel is greater than a float scale = enddis/startdis;//Gets the zoom multiple Matrix.set (Curre
 Ntmatrix);           Matrix.postscale (scale, SCALE,MIDPOINT.X,MIDPOINT.Y);
      }} break;
        The finger leaves the screen case MOTIONEVENT.ACTION_UP://When the contact leaves the screen, but there is also the contact point (finger) case MOTIONEVENT.ACTION_POINTER_UP:
        mode = 0;
      Break
        When there is already a contact point (finger) on the screen, then there is a contact that presses the screen case MotionEvent.ACTION_POINTER_DOWN:mode = mode_zoom;
        /** calculates the distance between two fingers */Startdis = distance (event);
          /** calculates the middle point between two fingers */if (Startdis > 10f) {//two fingers together when the pixel is greater than ten midpoint = Mid (event);
        Records the current ImageView magnification Currentmatrix.set (Getimagematrix ());
    } break;
    } setimagematrix (matrix);
  return true;
 }

OK, wrap up. That's all there is to it. Let's take a look at the entire class

Package com.jonkming.easyui.image.dragzoom.ui;
Import Android.content.Context;
Import Android.graphics.Matrix;
Import Android.graphics.PointF;
Import Android.util.AttributeSet;
Import android.view.MotionEvent;
Import Android.view.View;
Import Android.widget.ImageView;
Import Android.util.FloatMath; /** * Picture Zoom and drag class * @Title: Basedragzoomimageview.java * @Package com.jonkming.easyui.image.dragzoom.ui * @author HUANGMINGM ing * @date 2016/11/7 17:40 * @version V1.0/public class Basedragzoomimageview extends ImageView implements View.ontouc hlistener{/** Record is drag photo mode or zoom in to zoom out photo mode/private int mode = 0;//Initial state/** Drag photo mode * * private static final int mode_dr
  AG = 1;

  /** zoom in and zoom out photo Mode/private static final int mode_zoom = 2;
  /** used to record the coordinates at the start of the position * * Private PointF StartPoint = new PointF ();
  The/** is used to record the coordinates of the drag picture movement/private Matrix matrix = new Matrix ();

  /** is used to record the coordinates of the picture to be dragged at the time of the position * * Private Matrix Currentmatrix = new Matrix ();
  /** two fingers start distance * * Private float Startdis; /** two fingers.The Middle point * * private PointF midpoint;
    Public Basedragzoomimageview (context, AttributeSet attrs, int defstyle) {Super (context, attrs, Defstyle);
  Setontouchlistener (this);
    Public Basedragzoomimageview (context, AttributeSet attrs) {This (context, attrs, 0);
  Setontouchlistener (this);
    The public Basedragzoomimageview {This (context, NULL);
  Setontouchlistener (this);
    @Override public boolean Ontouch (View V, motionevent event) {/** holds the last eight digits through and operations Motionevent.action_mask = 255 * *
        Switch (event.getaction () & Motionevent.action_mask) {//Finger press down screen case Motionevent.action_down:
        mode = Mode_drag;
        Record ImageView The current moving position currentmatrix.set (Getimagematrix ());
        Startpoint.set (Event.getx (), event.gety ());
      Break  The finger moves on the screen, the change event will be constantly triggered case motionevent.action_move://Drag picture if (mode = = Mode_drag) {float DX = Event.getx ()-StartpoiNt.x; The moving distance of the x-axis is obtained from the float dy = event.gety ()-startpoint.y;
          To get the moving distance of the x-axis//Move the Matrix.set (Currentmatrix) before the position is not moved;
        Matrix.posttranslate (dx, dy); //Zoom Out picture Else if (mode = = Mode_zoom) {Float Enddis = distance (event);//end distance if (E Nddis > 10f) {//two fingers together when the pixel is greater than a float scale = enddis/startdis;//Gets the zoom multiple Matrix.set (Curre
            Ntmatrix);
          Matrix.postscale (scale, SCALE,MIDPOINT.X,MIDPOINT.Y);
      }} break;
        The finger leaves the screen case MOTIONEVENT.ACTION_UP://When the contact leaves the screen, but there is also the contact point (finger) case MOTIONEVENT.ACTION_POINTER_UP:
        mode = 0;
      Break
        When there is already a contact point (finger) on the screen, then there is a contact that presses the screen case MotionEvent.ACTION_POINTER_DOWN:mode = mode_zoom;
        /** calculates the distance between two fingers */Startdis = distance (event);
       /** calculates the middle point between two fingers */if (Startdis > 10f) {//two fingers together when the pixel is greater than ten midpoint = Mid (event);   Records the current ImageView magnification Currentmatrix.set (Getimagematrix ());
    } break;
    } setimagematrix (matrix);
  return true;
    /** calculates the distance between two fingers */private float distance (Motionevent event) {Float dx = event.getx (1)-event.getx (0);
    float dy = event.gety (1)-event.gety (0);
  /** uses the Pythagorean theorem to return the distance between two points * * (float) math.sqrt (DX * dx + dy * dy);
    /** calculates the middle point between two fingers */private 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);

 }
}

Then look at the layout file

<?xml version= "1.0" encoding= "Utf-8"?> <linearlayout xmlns:android=
"http://schemas.android.com/apk/" Res/android "
  android:orientation=" vertical "android:layout_width=" match_parent "
  android:layout_height=" Match_parent ">
  <com.jonkming.easyui.image.dragzoom.ui.basedragzoomimageview
    android:layout_width = "Match_parent"
    android:layout_height= "match_parent"
    android:src= "@drawable/dragandzoombase"
    Android:scaletype= "Matrix"
    />
</LinearLayout>

It's so simple.

Code Location: GitHub

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.