图片局部放大镜 可在大图上下左右移动并放大对应的区域

现实中使用放大镜可以放大对应的区域，软件中有时候也会用到放大镜功能，比如图片上某一点看不清楚，你不需要将整张图片都放大，只需要放大你想看到的部分，这个时候放大镜就派上用场了。

1.实现原理

如何实现放大镜的原理呢？一种方式我们可以采用将原图中的局部区域提取裁剪，然后在图片顶层的自定义控件上放大对应的倍数展示即可；另外一个种方式是将整图都放大相应的倍数，然后截取需要显示的区域，间接实现放大的效果，我使用的是第二种方法。

当然会涉及到平移，绘制边框的附加构件。

下面是实现的自定义类，具体注释见代码：

package com.example.zoompicview;import android.annotation.SuppressLint;import android.content.Context;import android.graphics.Bitmap;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Matrix;import android.graphics.Paint;import android.graphics.Path;import android.graphics.Path.Direction;import android.os.Looper;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;/*** @Description TODO 图片放大镜控件实现*/public class ZoomToolView extends View {private Path path;private Matrix matrix;private Paint paint;private Bitmap bitmap;private static final int RADIUS = 80;// 放大镜半径private static final int FACTOR = 3; // 放大系数private static final int STROKE = 4; // 附加线条宽度private float currentX, currentY;public ZoomToolView(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);init();}public ZoomToolView(Context context, AttributeSet attrs) {super(context, attrs);init();}public ZoomToolView(Context context) {super(context);init();}private void init() {path = new Path();path.addCircle(RADIUS, RADIUS, RADIUS, Direction.CW);matrix = new Matrix();matrix.setScale(FACTOR, FACTOR);paint = new Paint();paint.setAntiAlias(true);paint.setDither(true);paint.setStrokeWidth(STROKE);paint.setColor(Color.WHITE);paint.setStyle(Paint.Style.STROKE);}public Bitmap getBitmap() {return bitmap;}// 设置Bitmappublic void setBitmap(Bitmap bitmap) {if (null != bitmap) {this.bitmap = bitmap;} else {try {throw new Exception("bitmap can't be null");} catch (Exception e) {e.printStackTrace();}}}@SuppressLint("ClickableViewAccessibility")@Overridepublic boolean onTouchEvent(MotionEvent event) {if (null == bitmap) {return super.onTouchEvent(event);}currentX = event.getX();currentY = event.getY();// 控制不会移动出图片边界if (currentX > bitmap.getWidth()) {currentX = bitmap.getWidth();} else if (currentX < 0) {currentX = 0;}if (currentY > bitmap.getHeight()) {currentY = bitmap.getHeight();} else if (currentY < 0) {currentY = 0;}invalidateView();return true;}@SuppressLint("DrawAllocation")@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);if (null == bitmap) {try {throw new Exception("please setBitmap, bitmap can't be null");} catch (Exception e) {e.printStackTrace();}}// 底图canvas.drawBitmap(bitmap, 0, 0, null);// 剪切canvas.translate(currentX - RADIUS, currentY - RADIUS);canvas.clipPath(path);// 移动到path剪切部分显示canvas.translate(RADIUS - currentX * FACTOR, RADIUS - currentY * FACTOR);canvas.drawBitmap(bitmap, matrix, null);// 反向平移并绘制十字和外边框canvas.translate(currentX * FACTOR - RADIUS, currentY * FACTOR - RADIUS);Path line = new Path();line.moveTo(0, RADIUS);line.lineTo(RADIUS * 2, RADIUS);line.moveTo(RADIUS, 0);line.lineTo(RADIUS, RADIUS * 2);canvas.drawPath(line, paint);canvas.drawCircle(RADIUS, RADIUS, RADIUS - STROKE, paint);}private void invalidateView() {if (Looper.getMainLooper() == Looper.myLooper()) {invalidate();} else {postInvalidate();}}}

2.效果图

顶部的放大镜可以随着手指的移动而移动。

3.Demo 下载

点此下载