Android图片放大缩小自由移动控件

最新推荐文章于 2025-06-28 09:40:40 发布

zhb_android

最新推荐文章于 2025-06-28 09:40:40 发布

阅读量716

点赞数 1

本文介绍了一个自定义的ImageView组件，允许用户通过多点触控进行图片的缩放和平移操作。该组件通过监听触控事件并利用Matrix进行变换来实现图片的交互效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

public class ScaleImageView extends ImageView {

    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;

    public ScaleImageView(Context context) {
        super(context);
    }

    public ScaleImageView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

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

    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);
    }


    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 onTouchEvent(MotionEvent event) {
        if(event.getActionMasked()==MotionEvent.ACTION_POINTER_UP)
            Log.d("Infor", "多点操作");
        switch(event.getActionMasked()){
            case MotionEvent.ACTION_DOWN:
                matrix.set(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;
        }
        setImageMatrix(matrix);
        return true;
    }
}

直接在布局文件中当成自定义控件：

<zhong.imageviewdemo.ScaleImageView
    android:id="@+id/imageview_activity"
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:src="@drawable/sales_perform_new"
    android:scaleType="matrix"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true" />
其中有一行很关键的是android:scaleType="matrix"
这一行一定是设置成这样才有效果；