最近公司的项目中有一个图片加载和查看功能实现,具体是说通过列表项加载小图片,点击放大图片并且可以左右翻页,放缩等等,类似于微信朋友圈的照片墙功能。拿到这个需求后我想了想,图片列表首选当然是RecyclerView啦,线性布局,网格布局,瀑布流布局应有尽有,针对这个需求当然是网格布局咯。网络加载图片库那就多啦,从最初的Universal ImageLoader,到如今的Picasso,Fresco,Glide等等,都是很优秀的图片加载框架。作为一个喜欢回忆,有着一丝丝文艺风的程序猿(),我还是选择了经典却又不失美感的Universal ImageLoader。好了,第一个页面(列表展示页)的构建思路有了,那么,点击小图放大后的页面用什么实现呢?dialog?还是Activity?果断Activity啦,毕竟图片查看页面要做的事情很多,Activity更能满足我们的需求,下面,怎么翻页查看?果断ViewPager,多么好用的工具。图片手势缩放用什么?photoView呗,GitHub那么高的star,咱们先用着再说。好了,工具选好了,下面就是怎么实现代码了,让我们一步一步来。
步骤一:MainActivity
MainActivity就是我们用来展示图片列表页的Activity了,布局文件只有一个RecyclerView,不再赘述。
1.1 初始化universal ImageLoader
这里把imageLoader的初始化放在了Application当中,没啥可说的,如图所示
1.2初始化view和数据
其中,定义网格布局的时候我们设置了子项之间的间距,继承了ItemDecoration类,子类实现如下所示: