Android版本微信头像剪裁与系统剪裁之间的选择

hloong 于 2016-04-18 发布

tips:这是多年前的文章,当时的需求是要跟微信的图片剪裁做的一样,但是做的途中发现微信android版裁剪图片有bug,会在剪裁的时候跳动导致剪裁大图失效,后面跟微信的同学反馈后,随后的版本已经没有这个bug了,所以这篇已经没有价值了,纯留作记录,以下为2016年原文

当然选类似微信的剪裁咯,为什么?请看下文分析


转载请注明:http://blog.csdn.net/tmacsky/article/details/51179789

众所周知头像剪裁上传是绝大部分APP必备的功能之一,但是剪裁的模式有2种交互形式,

第一种是采用系统自带的剪裁功能,我个人是比较青睐系统的这种交互模式的,但是很可惜,在一些手机上出现问题,不得不弃用

device-2016-04-18-110009

第二种是微信版本自定义剪裁图,当然微信的这个并没有判断图片边界与自定义白色矩形框是否相连,我想这是一个bug吧,属于遗留问题

device-2016-04-18-105826

首先我们来看第一种 市面上常用的方法也是最早的方法,随便一搜就是,比如我们搜索到第一个结果页面 http://blog.csdn.net/geofferysun/article/details/42835669 就是典型的采用这种方式来做的 QQ截图20160418110751

没错,现在依然有大量的APP采用第一种方案,沿用系统的方法,但是这里有多重弊病,

但是这个问题我始终没有很好的办法解决,所以最后我只能判断如果是出问题的手机比如金立,那么就采用通常的做法将剪裁图片设置为 intent.putExtra("return-data", true); 如果是其他的手机就采用miui系统路径传递;这样能基本上解决这种剪裁出现的问题,但是不能保证以后其他手机会不会出现金立这样的问题,

所以我还是弃用了这种系统剪裁图片传递的方式采用第二种微信的方式

然后我在网上搜到了以下参考资料,其中clip-image犹豫项目太繁琐我没用采用,转而看了clip-image作者引用的2个csdn链接,其中大神鸿洋的博客我是经常关顾,但是很少练习,惭愧!

https://github.com/msdx/clip-image http://blog.csdn.net/lmj623565791/article/details/39761281 http://blog.csdn.net/xiechengfa/article/details/45702427

最后一个链接中的代码其实已经是很完善了,但是有一个问题,就是当图片过大的时候处理速度过慢,然后传递过程会出现问题, 比如小米4拍摄的图片分辨率很大,头像其实没必要过于清晰,设置头像大小和手机屏幕差不多宽就可以满足需求了,所以我将代码修改了

ClipImageActivity中的代码片段:

//不在内存中读取图片的宽高
opts.inJustDecodeBounds = true;
BitmapFactory.decodeFile(path, opts);
int width = opts.outWidth;
//注意此处为了解决1080p手机拍摄图片过大所以做了一定压缩,否则bitmap在小米4以及拍图比较大的机型上会显示黑屏
opts.inSampleSize = width > 1080 ? (int)(width / 1080) : 1 ;
opts.inJustDecodeBounds = false;// 这里一定要将其设置回false,因为之前我们将其设置成了true

并且将图片剪裁的时候设置了大小控制,比如我们是500kb的显示那就是

ClipZoomImageView文件中的代码片段:

//将剪裁的图片压缩到500k以下,如果没需求就注释该段代码
     ByteArrayOutputStream baos = new ByteArrayOutputStream(); 
       int options = 100;//保存的图片自动压缩低于500k
       bitmap.compress(Bitmap.CompressFormat.JPEG, options, baos);  
       while (baos.toByteArray().length / 1024 > 500) {   
           baos.reset();  
           options -= 10;  
           bitmap.compress(Bitmap.CompressFormat.JPEG, options, baos);  
   } 

如果你所需要的上传图片是其他值直接将500改成你所要的就可以了

完整代码(拿来就可以用的)地址:https://github.com/hloong/ClipHeadIcon

效果展示: 效果图片