`
阿尔萨斯
  • 浏览: 4643520 次
社区版块
存档分类
最新评论

Android 自定义ImageView支持缩放,拖拽,方便复用

 
阅读更多

今天刚发了一篇关于ImageView的缩放和拖拽的博客,然后我想了下,将他自定义下,方便我们来复用这个imageView,效果我就不多说了,http://blog.csdn.net/xiaanming/article/details/8827257就是这个效果,我只是把他抽出来自定义了下,代码还是贴上吧,我也将demo上传一下,有疑问大家指出来,大家共同学习,共同进步,呵呵

package com.example.myimageview;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.graphics.RectF;
import android.graphics.drawable.BitmapDrawable;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.FloatMath;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;

public class MyImageView extends ImageView{
    Matrix matrix = new Matrix();
    Matrix savedMatrix = new Matrix();
    /**位图对象*/
    private Bitmap bitmap = null;
    /** 屏幕的分辨率*/
    private DisplayMetrics dm;

    /** 最小缩放比例*/
    float minScaleR = 1.0f;
    
    /** 最大缩放比例*/
    static final float MAX_SCALE = 15f;

    /** 初始状态*/
    static final int NONE = 0;
    /** 拖动*/
    static final int DRAG = 1;
    /** 缩放*/
    static final int ZOOM = 2;
    
    /** 当前模式*/
    int mode = NONE;

    /** 存储float类型的x,y值,就是你点下的坐标的X和Y*/
    PointF prev = new PointF();
    PointF mid = new PointF();
    float dist = 1f;
    
    public MyImageView(Context context) {
		super(context);
		setupView();
	}
	
	public MyImageView(Context context, AttributeSet attrs) {
		super(context, attrs);
		setupView();
	}
	
	
	public void setupView(){
		Context context = getContext();
		//获取屏幕分辨率,需要根据分辨率来使用图片居中
		dm = context.getResources().getDisplayMetrics();
		
		//根据MyImageView来获取bitmap对象
		BitmapDrawable bd = (BitmapDrawable)this.getDrawable();
		if(bd != null){
			bitmap = bd.getBitmap();
		}
		
		//设置ScaleType为ScaleType.MATRIX,这一步很重要
		this.setScaleType(ScaleType.MATRIX);
		this.setImageBitmap(bitmap);
		
		//bitmap为空就不调用center函数
		if(bitmap != null){
			center(true, true);
		}
		this.setImageMatrix(matrix);
		this.setOnTouchListener(new OnTouchListener() {
			@Override
			public boolean onTouch(View v, MotionEvent event) {
				 switch (event.getAction() & MotionEvent.ACTION_MASK) {
			        // 主点按下
			        case MotionEvent.ACTION_DOWN:
			            savedMatrix.set(matrix);
			            prev.set(event.getX(), event.getY());
			            mode = DRAG;
			            break;
			        // 副点按下
			        case MotionEvent.ACTION_POINTER_DOWN:
			            dist = spacing(event);
			            // 如果连续两点距离大于10,则判定为多点模式
			            if (spacing(event) > 10f) {
			                savedMatrix.set(matrix);
			                midPoint(mid, event);
			                mode = ZOOM;
			            }
			            break;
			        case MotionEvent.ACTION_UP:{
			        	break;
			        }
			        case MotionEvent.ACTION_POINTER_UP:
			            mode = NONE;
			            //savedMatrix.set(matrix);
			            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;
			        }
				    MyImageView.this.setImageMatrix(matrix);
			        CheckView();
			        return true;
			}
		});
	}
	
	
    /**
     * 横向、纵向居中
     */
    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) {
            // 图片小于屏幕大小,则居中显示。大于屏幕,上方留空则往上移,下方留空则往下移
            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 = this.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);
    }

    
    /**
     * 限制最大最小缩放比例,自动居中
     */
    private void CheckView() {
        float p[] = new float[9];
        matrix.getValues(p);
        if (mode == ZOOM) {
            if (p[0] < minScaleR) {
            	//Log.d("", "当前缩放级别:"+p[0]+",最小缩放级别:"+minScaleR);
                matrix.setScale(minScaleR, minScaleR);
            }
            if (p[0] > MAX_SCALE) {
            	//Log.d("", "当前缩放级别:"+p[0]+",最大缩放级别:"+MAX_SCALE);
                matrix.set(savedMatrix);
            }
        }
        center(true, true);
    }
    
    
    /**
     * 两点的距离
     */
    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);
    }

    /**
     * 两点的中点
     */
    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);
    }
}
布局文件需要注意了,使用<com.example.myimageview.MyImageView></com.example.myimageview.MyImageView>标签,怕一些新手不知道,别怪我啰嗦
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
    <com.example.myimageview.MyImageView
        android:id="@+id/imageview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/item" >
    </com.example.myimageview.MyImageView>
</RelativeLayout>

新建一个MainActivity咯,

package com.example.myimageview;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		MyImageView myImageView = (MyImageView)findViewById(R.id.imageview);
		myImageView.setImageDrawable(getResources().getDrawable(R.drawable.item1));
	}
}


项目源码,点击下载


分享到:
评论

相关推荐

    自定义ImageView(可单点缩放回弹、拖拽、多点缩放)

    在这个案例中,我们关注的是一个自定义的ImageView,它不仅支持单点缩放和回弹,还能进行拖拽操作,并且能够实现多点触控的缩放功能。这样的组件在创建交互式图片查看器或者画廊应用时非常有用。下面我们将详细讨论...

    imageView图片缩放

    "imageView图片缩放"这个主题主要关注如何在Android平台上实现图片的交互式缩放,包括双手缩放和双击放大功能,并且允许用户拖动查看图片的不同部分。这种功能常用于查看大图、照片浏览应用或者地图应用等。 一、...

    Android自定义View-圆环布局

    "Android自定义View-圆环布局"是一个专为实现特定视觉效果和交互设计的项目,它包含了圆圈旋转、圆环拖动以及图标拖动和图片缩放等多种功能。 首先,我们来深入理解圆环布局。圆环布局是一种非标准的布局方式,它将...

    Android-ImageView:存放整理的一些自定义的ImageView控件

    这个名为"Android-ImageView"的项目显然是一份集合,其中包含了一些开发者自定义的ImageView控件,以扩展Android原生ImageView的功能。下面将详细探讨自定义ImageView的知识点以及可能在项目中实现的功能。 1. ...

    Android 微信朋友圈图片拖拽功能Demo

    5. **手势检测**:除了简单的拖动,可能还需要支持缩放、旋转等手势操作。这可以通过GestureDetector和ScaleGestureDetector等类来实现。 6. **自定义View**:为了实现这些高级功能,可能需要自定义一个ImageView...

    Android应用源码之imageView1.zip

    3. **自定义ImageView**:可能在源码中,开发者对ImageView进行了扩展,添加了特殊功能,比如手势缩放、旋转、拖动等交互效果,或者实现了更高效的图片加载策略。 4. **图片占位符与错误图**:在图片加载过程中,...

    android图片缩放,边界回弹,旋转,拖动,双击,单击,自动旋转摆正,图片居中显示

    在实际项目中,以上功能往往会被封装成一个自定义的ImageView子类,以方便复用和扩展。这样的自定义控件可能会包含复杂的逻辑,包括手势识别、动画处理等,需要对Android的UI系统有深入的理解。 总的来说,"android...

    Android 多点触控,多张图片拖拽,缩放,旋转

    在Android开发中,实现多点触控功能,如图片的拖拽、缩放和旋转,是提高用户体验的关键技术之一。本文将深入探讨如何在Android应用中实现这些特性,特别是针对多张图片的操作。 首先,我们需要了解Android中的触摸...

    Android图片可拖动任意位置

    - 如果需要支持多指拖动或者缩放,需要处理`MotionEvent`的`ACTION_POINTER_DOWN`和`ACTION_POINTER_UP`事件,以及`getPointerCount()`和`getPointerId()`方法。 8. **内存管理**: - 当图片较大时,要考虑内存...

    Android多点触控技术实战,对图片进行缩放和移动Demo

    在Android开发中,多点触控(Multi-Touch)技术是一项关键特性,它允许用户同时使用两个或更多手指与屏幕进行交互,如缩放、旋转和拖动等操作。本项目是一个关于Android多点触控的实战应用,通过实现图片的双指缩放...

    Android应用源码之DragList(可拖拽移动的ListView).rar

    "Android应用源码之DragList(可拖拽移动的ListView)" 这个标题揭示了我们要探讨的是一个Android开发中的特殊组件——DragList。DragList是ListView的一个扩展,它允许用户通过触摸和拖动来改变列表中条目的顺序。在...

    Android-微博微信图库效果微信视频拖放效果

    这通常需要自定义ImageView来实现。 - GIF支持:支持GIF动图展示,可能需要使用第三方库如Glide的GifDrawable或者Android的AnimationDrawable2。 5. 视频拖放: - 实现视频拖放功能,需要处理触摸事件,计算手指...

    Android高级应用源码-带自定义编辑功能的圆形头像.zip

    1. **自定义视图**: 在Android中,我们通常通过继承`View`或`ImageView`类来创建自定义视图。在这个项目中,开发者可能创建了一个自定义的`CircleImageView`,用于显示圆形头像,并可能添加了额外的功能,如编辑、...

    Android应用源码之MyImageView4.zip

    - **手势操作**:可能支持缩放、旋转、拖动等手势识别,使得用户能交互式地操作图片。 - **图片加载优化**:可能实现了图片的异步加载和缓存机制,提高用户体验。 - **动画效果**:比如淡入淡出、平移、旋转等,...

    Android应用源码控件以及双指放大缩小图片、单指拖动图片.zip

    在实现这些功能时,我们通常会在一个自定义的`View`或者`ImageView`子类中进行。这样可以更方便地控制和绘制图片。在`onDraw`方法中,根据图片的缩放比例和位置进行绘制,确保图片在屏幕上正确显示。 此外,我们还...

    Android_UI_Widget

    - **ImageView**:显示图片资源,支持缩放和裁剪。 - **CheckBox**和**RadioButton**:提供多选和单选功能。 - **Spinner**:下拉选择列表,常用于选项选择。 - **ProgressBar**:进度条,表示任务完成程度。 -...

    GalleryDemo_画廊效果Android源码.zip

    2. 拖拽选中:可以添加手势识别,支持拖拽选中图片。 3. 添加指示器:为当前选中的项添加视觉提示,如小圆点指示器,提升用户导航感。 4. 异步加载:结合异步加载库(如 Glide 或 Picasso),实现大图的懒加载,防止...

    Android-通用app个人中心头像修改工具支持拍照相册裁剪操作

    在Android应用开发中,个人中心头像的修改是常见的功能之一,它允许用户自定义自己的形象,提升用户体验。本文将详细解析如何构建一个通用的app个人中心头像修改工具,支持拍照、从相册选择以及裁剪图片的操作。这个...

Global site tag (gtag.js) - Google Analytics