Chinaunix首页 | 论坛 | 博客
  • 博客访问: 144505
  • 博文数量: 47
  • 博客积分: 0
  • 博客等级: 民兵
  • 技术积分: 547
  • 用 户 组: 普通用户
  • 注册时间: 2014-09-01 08:57
个人简介

一个人的生活 新奇视 新感觉 www.x74.cn

文章分类

全部博文(47)

文章存档

2018年(20)

2017年(25)

2015年(1)

2014年(1)

我的朋友

分类: Android平台

2018-03-15 16:14:17

本项目受Google官方demo Zooming a View 启发,实现了点击小图放大至全屏预览,退出全屏恢复至原来位置这两个过程的动画过渡。 常见应用场景如微信朋友圈照片九宫格和微信聊天图片预览,某些手机系统相册等viewpager图片查看 缩放 拖拽下拉缩小退出(效果同微信图片浏览)

be6e713b424d163e63f15d4571c34a5b_15211010745aaa291204056.gif

特点 1.支持自定义图片加载框架。 2.支持重写activity,完成切换切换效果。 3.图片查看 缩放 拖拽下拉缩小退出。 4.支持自定义activity,Fragment。 5.支持类似微信朋友圈照片九宫格和微信聊天图片预览。 6.指示器类型选择 圆点模式(贝塞尔圆点指示器)和数字模式。 7.增加接口实体类。不在使用数据转化。 ####效果如下:

通过Gradle抓取:

  1. compile 'com.ycjiang:ImagePreview:2.1.2'

1.本项目类库依赖第三库

注意: 由于的photoview有些事件冲突,将1.3.1版本源代码修改采用依赖本地。

  1. compile 'com.android.support:support-fragment:25.3.1'
  2. compile 'com.android.support:support-core-utils:25.3.1'

2.示例代码

注意:: 你实现自定义类,在你 app onCreate() 中

  1. @Override
  2. public void onCreate() {
  3. super.onCreate();
  4. ZoomMediaLoader.getInstance().init(new TestImageLoader());
  5. }

1.使用方式

  1. GPreviewBuilder.from(GridViewCustomActivity.this)//activity实例必须
  2. .to(CustomActivity.class)//自定义Activity 使用默认的预览不需要
  3. .setData(mThumbViewInfoList)//集合
  4. .setUserFragment(UserFragment.class)//自定义Fragment 使用默认的预览不需要
  5. .setCurrentIndex(position)
  6. .setSingleFling(false)//是否在黑屏区域点击返回
  7. .setDrag(false)//是否禁用图片拖拽返回
  8. .setType(GPreviewBuilder.IndicatorType.Dot)//指示器类型
  9. .start();//启动

2.列表控件item点击事件添加相应代码。 (RecyclerView为例,demo有(ListView和GridView和九宫格控件实例代码))

  1. mRecyclerView.addOnItemTouchListener(new OnItemClickListener() {
  2. @Override
  3. public void SimpleOnItemClick(BaseQuickAdapter baseQuickAdapter, View view, int position) {
  4. //在你点击时,调用computeBoundsBackward()方法
  5. computeBoundsBackward(mGridLayoutManager.findFirstVisibleItemPosition());
  6. GPreviewBuilder.from(RecycleViewActivity.this)
  7. .setData(mThumbViewInfoList)
  8. .setCurrentIndex(position)
  9. .setType(GPreviewBuilder.IndicatorType.Number)
  10. .start();
  11. }
  12. });
  13. /**
  14. ** 查找信息
  15. * 从第一个完整可见item逆序遍历,如果初始位置为0,则不执行方法内循环
  16. */
  17. private void computeBoundsBackward(int firstCompletelyVisiblePos) {
  18. for (int i = firstCompletelyVisiblePos;i < mThumbViewInfoList.size(); i++) {
  19. View itemView = mGridLayoutManager.findViewByPosition(i);
  20. Rect bounds = new Rect();
  21. if (itemView != null) {
  22. ImageView thumbView = (ImageView) itemView.findViewById(R.id.iv);
  23. thumbView.getGlobalVisibleRect(bounds);
  24. }
  25. mThumbViewInfoList.get(i).setBounds(bounds);
  26. }
  27. }

2.构造实体类: 你的实体类实现IThumbViewInfo接口

  1. public class UserViewInfo implements IThumbViewInfo {
  2. private String url; //图片地址
  3. private Rect mBounds; // 记录坐标
  4. private String user;//
  5. public UserViewInfo(String url) {
  6. this.url = url;
  7. }
  8. @Override
  9. public String getUrl() {//将你的图片地址字段返回
  10. return url;
  11. }
  12. public void setUrl(String url) {
  13. this.url = url;
  14. }
  15. @Override
  16. public Rect getBounds() {//将你的图片显示坐标字段返回
  17. return mBounds;
  18. }
  19. public void setBounds(Rect bounds) {
  20. mBounds = bounds;
  21. }
  22. }

3.使用自定义图片加载配置 注意这个必须实现哦。不然加载

1在你项目工程,创建一个类 实现接口IZoomMediaLoader接口 如下代码 demo 采用glide ,可以使用Picassor Imagloader 图片加载框架

  1. public class TestImageLoader implements IZoomMediaLoader {
  2. @Override
  3. public void displayImage(Fragment context, String path, final MySimpleTarget<Bitmap> simpleTarget) {
  4. Glide.with(context).load(path).asBitmap().centerCrop().diskCacheStrategy(DiskCacheStrategy.SOURCE)
  5. .error(R.drawable.ic_default_image)
  6. .into(new SimpleTarget<Bitmap>() {
  7. @Override
  8. public void onResourceReady(Bitmap resource, GlideAnimation super Bitmap> glideAnimation) {
  9. simpleTarget.onResourceReady(resource);
  10. }
  11. @Override
  12. public void onLoadStarted(Drawable placeholder) {
  13. super.onLoadStarted(placeholder);
  14. simpleTarget.onLoadStarted();
  15. }
  16. @Override
  17. public void onLoadFailed(Exception e, Drawable errorDrawable) {
  18. super.onLoadFailed(e, errorDrawable);
  19. simpleTarget.onLoadFailed(errorDrawable);
  20. }
  21. });
  22. }
  23. @Override
  24. public void onStop(@NonNull Fragment context) {
  25. Glide.with(context).onStop();
  26. }
  27. @Override
  28. public void clearMemory(@NonNull Context c) {
  29. Glide.get(c).clearMemory();
  30. }

4.自定义Activity,Fragment

1.实现自定义Activity,实现你业务操作例如加入标题栏,ViewPager切换动画等等 .image.png

在你的布局中,引用类库核心布局

2.实现自定义Fragment 实现自定义业务 例如 长按保存图片,编辑图片,对图片说明内容等等 图片缩放效果采用PhotoView image.png

需要布局自定义重写onCreateView()。引用你自定义布局中添加 3 使用细节注意:

1.Activity和Fragment可以单独使用,也可以组合一起使用 2.自定义使用布局时,不在子类使用setContentView()方法 3.你在Activity 重写 setContentLayout(),返回你的自定义布局 4.在你布局内容 使用include 5.layout="@layout/activity_image_preview_photo" 预览布局添加你布局中 6.GPreviewBuilder 调用 from()方法后,调用to();指向你.to(CustomActivity.class)自定义预览activity 7.别忘了在AndroidManifest activity 使用主题

博客原文地址:http://www.apkbus.com/blog-928212-77251.html

阅读(1945) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~