前言
我们在微信朋友圈看别人发的带图片说说时,点击某张图片,会放大全屏显示,并且左右滑动可以切换浏览多张图片。
这种效果应用场景很多,尤其是购物和餐饮类app很常见。比如点餐软件,一般会向顾客使用列表方式整体展示所有菜品的缩略图、价格、原料、做法、营养功效、食客评价等,由于缩略图提供的直观信息不全不清晰,顾客还可以点击缩略图进一步查看菜品的多张实拍大图,效果就是点击缩略图弹出大图,左右滑动切换图片,屏幕底部小圆点指示当前图片索引,然后点击大图,大图消失会弹回去,回到缩略图界面。
购物类app如淘宝在用户选择商品时,一般会点击商品缩略图,全屏展示商品多张高清实物图,也可以滑动浏览,点击实物图,又会回到之前页面。
此时,我们可能会琢磨这种效果该如何实现。其实并不难,使用ViewPager配合Activity一些特性,再加上必要的过渡动画即可完成。
具体实现流程
一、定义一个专门用来显示弹出大图的Activity
因为图片要全屏展示,所以我们要在onCreate生命周期的方法里加上这样一句