0°

Android 仿QQ、新浪相册的实现

内容预览:
  • 最近我也在准备一个开源的相册项目,以方便以后开发应用的时候使用,也...~
  •   这样,我们就可以明确我们需要实现的功能有: 获取手机中的最新...~
  • 目前已加入调用系统相机拍照功能(与微信相同),自定义拍照(新浪)将...~

始发于微信公众号: 程序员小乐


分享编程技能、互联网技术、生活感悟、打造干货分享平台,将总结的技术、心得、经验分享给大家,这里不只限于技术!学无止境,不求尽如人意,但求问心无愧。让学习成为一种美、一种习惯。值得爱学习的你去关注,感觉有帮助转发分享让更多的人去关注!点击上方 蓝字 关注!



作者:湖广午王

链接:http://blog.csdn.net/junzia/article/details/53091606
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

Android 仿QQ、新浪相册的实现—– 由   分享


每日英语

No one can go with you for a lifetime, so you have to adjust yourself to be alone; no one will help you again and again, so you have to fight all the time.

没有人陪你走一辈子,所以你要适应孤独;没有人会帮你一辈子,所以你要一直奋斗。



在移动应用中,很多时候都会用到图片选择、图片裁剪等功能。最近我也在准备一个开源的相册项目,以方便以后开发应用的时候使用,也尽可能的方便需要的人。一个完整的相册,应该包含相册列表、图片列表、图片的单选和多选、图片的裁剪、拍照、多选图片的大图预览等功能。这也是我这个项目将要包含的功能。在本篇博客中,将会讲述下我在这个项目中相册列表和图片列表的大致实现。


实现效果



结合几个常用的APP中的相册效果,当前项目中已经实现了一些基本的功能和UI,在后续完善的过程中还会有所变动。项目在Github上开源https://github.com/doggycoder/ImageChooser,欢迎fork和star。先展示实现的效果(后面会增加拍照功能):


Android 仿QQ、新浪相册的实现 Android 仿QQ、新浪相册的实现 Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现 Android 仿QQ、新浪相册的实现


准备数据



在实现相册功能之前,我们先需要明确它的逻辑。参照QQ、新浪、微博这中巨头级的APP,当我们需要用选择图片时,会先打开相册,获取到最新的照片列表。然后点击一个按钮可以展开相册列表,点击列表内容,可以切换相册,刷新当前照片列表中的内容。而且选择这篇的时候,会有单选、多选、单选并裁剪等情况,多选的时候还要出现选择效果和指示器等,单选的时候如果需要裁剪则进入裁剪页,不裁剪则默认确定选择,(拍照功能在后续博客中再说明)。 

这样,我们就可以明确我们需要实现的功能有:


  1. 获取手机中的最新图片

  2. 获取手机中的相册列表

  3. 获取制定相册中的所有图片

  4. 展示图片和相册

  5. 多图选择时需要有选择效果和指示器

  6. 单选裁剪时需要用到裁剪功能


另外,扫描手机中的图片也是一个相对耗时的工作,所以这个工作还需要主要避免放到主线程中。


准备数据



Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现


这样,我们就可以利用这个工具类方便的获取相册列表、获取制定相册的图片了(最新照片合集当做是一个相册)。里面主要就是使用ContentResolver来做查询,Android入门级问题,四大组件——Activity、Service、ContentProvider和BroadcastReceiver,中的ContentProvider和ContentResolver就是一对CP了,ContentProvider用来提供数据,ContentResolver用来获取数据。


客。


展示相册和相册列表



有了获取相册列表和获取指定相册的方法,展示相册和相册列表就容易了,按照通常的方式,我们直接使用GridView来展示相册,用ListView来展示相册列表。当然,你也可以选择使用RecyclerView来替代掉GridView和ListView,其实也都一样。 
显示图片直接使用成熟的第三方框架即可,我使用的是Glide。 
值得注意的是,在相册中,我们展示出来的图片都是正方块、并且需要三个(你也可以设置四个或者五个,只要你高兴)铺满宽度。在这里我使用的是比较懒的方式,直接用一个自定义的布局作为Item的跟布局,这个自定义布局继承RelativeLayout,然后将复写它的onMeasure方法:


Android 仿QQ、新浪相册的实现


选择指示器



像QQ中,选择图片时,图片会根据选择的顺序,在图片上的那个圈圈里面显示出1234……等数字,然后取消选择时,被选的数字会顺序补位,比如你选了七张图片、然后取消了显示数字3的那张,这时4就变成3了、5变成了4、6变成了5。 

像新浪微博中的图片选择,不会出现数字,而是出现一个勾,选中的时候这个勾还有动画效果。 
这样的功能怎么实现呢? 
我实现的方式是,在每个Item中都有一个固定大小的View,根据图片是否被选中,加载不同的Drawable。当然,写这个项目既然是为了以后在不同的项目中使用,这个自然要方便被使用者自行设置。所以我写一个抽象类:


Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现


在相册的Adapter的构造函数中会传入一个IChooseDrawable实体,在显示每个Item时,会根据当前状态通过drawable.get(int state)取得指定的Drawable,设置为指示器View的背景。 
上面效果图中的指示器(也可配置为只显示对号)实现为:


Android 仿QQ、新浪相册的实现

Android 仿QQ、新浪相册的实现


裁剪、单选和多选



单选和多选的区别在于单选的时候,没有选择指示器,选中直接携带数据返回。而多选时,有选择指示器,选择完成后,需要确定后携带数据返回,在确定前可以取消之前所选的内容。 
所以实现的时候,只需要判断用户传入的选择意图,做出相应的处理。如果是裁剪,则选择一张图片后,进入到裁剪页面,裁剪结束后携带裁剪结果返回到进入到相册前的页面。如果是单选,则选择一张图片后,直接携带数据返回到进入相册前的页面。如果是多选,则要在点击确认按钮后,携带数据返回到进入相册前的页面。裁剪的实现见上一篇博客——Android 图片裁剪(http://blog.csdn.net/junzia/article/details/52950210


其它



其他的一些功能,主要是拍照的功能、和大图切换预览现在还未添加进项目中,目前准备是利用OpenGl做拍照预览和拍照(也许会添加些许常用滤镜)。目前已加入调用系统相机拍照功能(与微信相同),自定义拍照(新浪)将在后续增加。实现的相关细节也会在后续单独写博客来介绍。

每日掏心话

 时间会告诉我们,简单的喜欢,最长远;平凡中的陪伴,最心安;懂你的人,最温暖。  


Android 仿QQ、新浪相册的实现


推荐阅读





小密圈
这里聚集了业界内的大牛,值得各位大牛的加入!


看完本文有收获?请转发分享给更多人
关注「杨守乐」,提升编程技能

【QQ技术群】279126311 []
【QQ技术群】484572225 [未]

以上就是:Android 仿QQ、新浪相册的实现 的全部内容。

本站部分内容来源于互联网和用户投稿,如有侵权请联系我们删除,谢谢。
Email:[email protected]


0 条回复 A 作者 M 管理员
    所有的伟大,都源于一个勇敢的开始!
欢迎您,新朋友,感谢参与互动!欢迎您 {{author}},您在本站有{{commentsCount}}条评论