Question

我有自定义的缩放缩放布局代码，但我想将它放入画布。我应该如何更改它以便可以在画布上进行缩放？

来自https://gist.github.com/klarson2/4f737adf7f2577dc0fd09efb85eff3b1的缩放代码：

private void init(Context context) {
    final ScaleGestureDetector scaleDetector = new ScaleGestureDetector(context, this);
    this.setOnTouchListener(new View.OnTouchListener() {
      @Override
      public boolean onTouch(View view, MotionEvent motionEvent) {
        switch (motionEvent.getAction() & MotionEvent.ACTION_MASK) {
          case MotionEvent.ACTION_DOWN:
            Log.i(TAG, "DOWN");
            if (scale > MIN_ZOOM) {
              mode = Mode.DRAG;
              startX = motionEvent.getX() - prevDx;
              startY = motionEvent.getY() - prevDy;
            }
            break;
          case MotionEvent.ACTION_MOVE:
            if (mode == Mode.DRAG) {
              dx = motionEvent.getX() - startX;
              dy = motionEvent.getY() - startY;
            }
            break;
          case MotionEvent.ACTION_POINTER_DOWN:
            mode = Mode.ZOOM;
            break;
          case MotionEvent.ACTION_POINTER_UP:
            mode = Mode.NONE; 
            break;
          case MotionEvent.ACTION_UP:
            Log.i(TAG, "UP");
            mode = Mode.NONE;
            prevDx = dx;
            prevDy = dy;
            break;
        }
        scaleDetector.onTouchEvent(motionEvent);

        if ((mode == Mode.DRAG && scale >= MIN_ZOOM) || mode == Mode.ZOOM) {
          getParent().requestDisallowInterceptTouchEvent(true);
          float maxDx = child().getWidth() * (scale - 1);  // adjusted for zero pivot
          float maxDy = child().getHeight() * (scale - 1);  // adjusted for zero pivot
          dx = Math.min(Math.max(dx, -maxDx), 0);  // adjusted for zero pivot
          dy = Math.min(Math.max(dy, -maxDy), 0);  // adjusted for zero pivot
          Log.i(TAG, "Width: " + child().getWidth() + ", scale " + scale + ", dx " + dx
            + ", max " + maxDx);


          applyScaleAndTranslation();
            }

            return true;
          }
        });
      }

      // ScaleGestureDetector

      @Override
      public boolean onScaleBegin(ScaleGestureDetector scaleDetector) {
        return true;
      }

  @Override
  public boolean onScale(ScaleGestureDetector scaleDetector) {
    float scaleFactor = scaleDetector.getScaleFactor();
    if (lastScaleFactor == 0 || (Math.signum(scaleFactor) == Math.signum(lastScaleFactor))) {
      float prevScale = scale;
      scale *= scaleFactor;
      scale = Math.max(MIN_ZOOM, Math.min(scale, MAX_ZOOM));
      lastScaleFactor = scaleFactor;
      float adjustedScaleFactor = scale / prevScale;
      // added logic to adjust dx and dy for pinch/zoom pivot point
      float focusX = scaleDetector.getFocusX();
      float focusY = scaleDetector.getFocusY();
      dx += (dx - focusX) * (adjustedScaleFactor - 1);
      dy += (dy - focusY) * (adjustedScaleFactor - 1);
    } else {
      lastScaleFactor = 0;
    }
    return true;
  }

  @Override
  public void onScaleEnd(ScaleGestureDetector scaleDetector) {
     Log.i(TAG, "onScaleEnd");
  }

  private void applyScaleAndTranslation() {
    child().setScaleX(scale);
    child().setScaleY(scale);
    child().setPivotX(0f);  // default is to pivot at view center
    child().setPivotY(0f);  // default is to pivot at view center
    child().setTranslationX(dx);
    child().setTranslationY(dy);
  }

  private View child() {
    return getChildAt(0);
  }

Answer 1

我这样做了：

在这里你可以在父视图中添加多个图像，对于我添加了3个图像的样本。

<强>截图：

<强> ZoomableViewGroup.java：

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;

/**
 * Created by hiren.patel on 25-04-2016.
 */

public class ZoomableViewGroup extends ViewGroup {

    // these matrices will be used to move and zoom image
    private Matrix matrix = new Matrix();
    private Matrix matrixInverse = new Matrix();
    private Matrix savedMatrix = new Matrix();
    // we can be in one of these 3 states
    private static final int NONE = 0;
    private static final int DRAG = 1;
    private static final int ZOOM = 2;
    private int mode = NONE;
    // remember some things for zooming
    private PointF start = new PointF();
    private PointF mid = new PointF();
    private float oldDist = 1f;
    private float[] lastEvent = null;

    private boolean initZoomApplied = false;

    private float[] mDispatchTouchEventWorkingArray = new float[2];
    private float[] mOnTouchEventWorkingArray = new float[2];

    @Override
    public boolean dispatchTouchEvent(MotionEvent ev) {
        mDispatchTouchEventWorkingArray[0] = ev.getX();
        mDispatchTouchEventWorkingArray[1] = ev.getY();
        mDispatchTouchEventWorkingArray = screenPointsToScaledPoints(mDispatchTouchEventWorkingArray);
        ev.setLocation(mDispatchTouchEventWorkingArray[0],
                mDispatchTouchEventWorkingArray[1]);
        return super.dispatchTouchEvent(ev);
    }

    private float[] scaledPointsToScreenPoints(float[] a) {
        matrix.mapPoints(a);
        return a;
    }

    private float[] screenPointsToScaledPoints(float[] a) {
        matrixInverse.mapPoints(a);
        return a;
    }

    public ZoomableViewGroup(Context context) {
        super(context);
        init(context);
    }

    public ZoomableViewGroup(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public ZoomableViewGroup(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }

    /**
     * Determine the space between the first two fingers
     */
    private float spacing(MotionEvent event) {
        float x = event.getX(0) - event.getX(1);
        float y = event.getY(0) - event.getY(1);
        return (float)Math.sqrt(x * x + y * y);
    }

    /**
     * Calculate the mid point of the first two fingers
     */
    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);
    }


    private void init(Context context) {

    }


    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        int childCount = getChildCount();
        for (int i = 0; i < childCount; i++) {
            View child = getChildAt(i);
            if (child.getVisibility() != GONE) {
                child.layout(l, t, l + child.getMeasuredWidth(), t + child.getMeasuredHeight());
            }
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int heightSize = MeasureSpec.getSize(heightMeasureSpec);

        float[] values = new float[9];
        matrix.getValues(values);
        float container_width = values[Matrix.MSCALE_X] * widthSize;
        float container_height = values[Matrix.MSCALE_Y] * heightSize;

        //Log.d("zoomToFit", "m width: "+container_width+" m height: "+container_height);
        //Log.d("zoomToFit", "m x: "+pan_x+" m y: "+pan_y);

        int childCount = getChildCount();
        for (int i = 0; i < childCount; i++) {
            View child = getChildAt(i);
            if (child.getVisibility() != GONE) {
                measureChild(child, widthMeasureSpec, heightMeasureSpec);

                if (i == 0 && !initZoomApplied && child.getWidth() > 0) {
                    int c_w = child.getWidth();
                    int c_h = child.getHeight();

                    //zoomToFit(c_w, c_h, container_width, container_height);
                }
            }
        }

    }

    private void zoomToFit(int c_w, int c_h, float container_width, float container_height) {
        float proportion_firstChild = (float) c_w / (float) c_h;
        float proportion_container = container_width / container_height;

        //Log.d("zoomToFit", "firstChildW: "+c_w+" firstChildH: "+c_h);
        //Log.d("zoomToFit", "proportion-container: "+proportion_container);
        //Log.d("zoomToFit", "proportion_firstChild: "+proportion_firstChild);

        if (proportion_container < proportion_firstChild) {
            float initZoom = container_height / c_h;
            //Log.d("zoomToFit", "adjust height with initZoom: "+initZoom);
            matrix.postScale(initZoom, initZoom);
            matrix.postTranslate(-1 * (c_w * initZoom - container_width) / 2, 0);
            matrix.invert(matrixInverse);
        } else {
            float initZoom = container_width / c_w;
            //Log.d("zoomToFit", "adjust width with initZoom: "+initZoom);
            matrix.postScale(initZoom, initZoom);
            matrix.postTranslate(0, -1 * (c_h * initZoom - container_height) / 2);
            matrix.invert(matrixInverse);
        }
        initZoomApplied = true;
        invalidate();
    }

    @Override
    protected void dispatchDraw(Canvas canvas) {
        canvas.save();
        canvas.setMatrix(matrix);
        super.dispatchDraw(canvas);
        canvas.restore();
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        // handle touch events here
        mOnTouchEventWorkingArray[0] = event.getX();
        mOnTouchEventWorkingArray[1] = event.getY();

        mOnTouchEventWorkingArray = scaledPointsToScreenPoints(mOnTouchEventWorkingArray);

        event.setLocation(mOnTouchEventWorkingArray[0], mOnTouchEventWorkingArray[1]);

        switch (event.getAction() & MotionEvent.ACTION_MASK) {
            case MotionEvent.ACTION_DOWN:
                savedMatrix.set(matrix);
                start.set(event.getX(), event.getY());
                mode = DRAG;
                lastEvent = null;
                break;
            case MotionEvent.ACTION_POINTER_DOWN:
                oldDist = spacing(event);
                if (oldDist > 10f) {
                    savedMatrix.set(matrix);
                    midPoint(mid, event);
                    mode = ZOOM;
                }
                lastEvent = new float[4];
                lastEvent[0] = event.getX(0);
                lastEvent[1] = event.getX(1);
                lastEvent[2] = event.getY(0);
                lastEvent[3] = event.getY(1);
                //d = rotation(event);
                break;
            case MotionEvent.ACTION_UP:
            case MotionEvent.ACTION_POINTER_UP:
                mode = NONE;
                lastEvent = null;
                break;
            case MotionEvent.ACTION_MOVE:
                if (mode == DRAG) {
                    matrix.set(savedMatrix);
                    float dx = event.getX() - start.x;
                    float dy = event.getY() - start.y;
                    matrix.postTranslate(dx, dy);
                    matrix.invert(matrixInverse);
                } else if (mode == ZOOM) {
                    float newDist = spacing(event);
                    if (newDist > 10f) {
                        matrix.set(savedMatrix);
                        float scale = (newDist / oldDist);
                        matrix.postScale(scale, scale, mid.x, mid.y);
                        matrix.invert(matrixInverse);
                    }
                }
                break;
        }

        invalidate();
        return true;
    }

}

<强> activity_main.xml中：

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context=".MainActivity">

    <com.zoomcontroldemo.ZoomableViewGroup
        android:id="@+id/zoomControl"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <FrameLayout
            android:id="@+id/frameLayoutParent"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <ImageView
                android:id="@+id/imageView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="center" />
        </FrameLayout>
    </com.zoomcontroldemo.ZoomableViewGroup>


</RelativeLayout>

<强> MainActivity.java：

public class MainActivity extends Activity {

    private FrameLayout frameLayoutParent;
    private ImageView imageView;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        frameLayoutParent = (FrameLayout)findViewById(R.id.frameLayoutParent);
        imageView = (ImageView) findViewById(R.id.imageView);
        Bitmap originalBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.desert);
        imageView.setImageBitmap(originalBitmap);

        createAndAddLocator(50, 50, 100, 100);
        createAndAddLocator(50, 50, 200, 200);
        createAndAddLocator(50, 50, 300, 300);
    }

    private void createAndAddLocator(int width, int height, int x, int y){
        ImageView imageView = new ImageView(MainActivity.this);
        imageView.setImageDrawable(getResources().getDrawable(R.drawable.ic_launcher));
        FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(width, height);
        params.leftMargin = x;
        params.topMargin  = y;
        frameLayoutParent.addView(imageView, params);
    }
}

希望这会对你有所帮助。

画布捏放大android

1 个答案: