android 图片查看动画,GitHub - wzandroid/ImageWatcher: 一种无缝顺畅的动画切换到图片查看的界面,同样以一种无缝顺畅的动画退出图片查看界面 *支持多图查看,快速翻...

#ImageWatcher

图片查看器,为各位追求用户体验的daLao提供更优质的服务

它能够

*点击图片时以一种无缝顺畅的动画切换到图片查看的界面,同样以一种无缝顺畅的动画退出图片查看界面

*支持多图查看,快速翻页,双击放大,单击退出,双手缩放旋转图片

*下拽退出查看图片的操作,以及效果是本View的最大卖点(仿微信)

5317ae8ab6e8d568409c74d71787476a.gif

222.gif

333.gif

444.gif

实现步骤

在module的gradle

implementation 'com.byc:ImageWatcher:1.1.0'

or 下载 module

implementation project(':imagewatcher')

方法一

在Activity对应布局文件

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/v_image_watcher"

android:layout_width="match_parent"

android:layout_height="match_parent"/>

然后在Activity onCreate里面简单的初始化一下

// 一般来讲, ImageWatcher 需要占据全屏的位置

vImageWatcher = (ImageWatcher) findViewById(R.id.v_image_watcher);

// 如果不是透明状态栏,你需要给ImageWatcher标记 一个偏移值,以修正点击ImageView查看的启动动画的Y轴起点的不正确

vImageWatcher.setTranslucentStatus(!isTranslucentStatus ? Utils.calcStatusBarHeight(this) : 0);

// 配置error图标 如果不介意使用lib自带的图标,并不一定要调用这个API

vImageWatcher.setErrorImageRes(R.mipmap.error_picture);

// 长按图片的回调,你可以显示一个框继续提供一些复制,发送等功能

vImageWatcher.setOnPictureLongPressListener(this);

vImageWatcher.setLoader(new GlideSimpleLoader());

vImageWatcher.setOnStateChangedListener(new ImageWatcher.OnStateChangedListener() {

@Override

public void onStateChangeUpdate(ImageWatcher imageWatcher, ImageView clicked, int position, Uri uri, float animatedValue, int actionTag) {

Log.e("IW", "onStateChangeUpdate [" + position + "][" + uri + "][" + animatedValue + "][" + actionTag + "]");

}

@Override

public void onStateChanged(ImageWatcher imageWatcher, int position, Uri uri, int actionTag) {

if (actionTag == ImageWatcher.STATE_ENTER_DISPLAYING) {

Toast.makeText(getApplicationContext(), "点击了图片 [" + position + "]" + uri + "", Toast.LENGTH_SHORT).show();

} else if (actionTag == ImageWatcher.STATE_EXIT_HIDING) {

Toast.makeText(getApplicationContext(), "退出了查看大图", Toast.LENGTH_SHORT).show();

}

}

});

新的初始化方式二

iwHelper = ImageWatcherHelper.with(this, new GlideSimpleLoader()) // 一般来讲, ImageWatcher 需要占据全屏的位置

.setTranslucentStatus(!isTranslucentStatus ? Utils.calcStatusBarHeight(this) : 0) // 如果不是透明状态栏,你需要给ImageWatcher标记 一个偏移值,以修正点击ImageView查看的启动动画的Y轴起点的不正确

.setErrorImageRes(R.mipmap.error_picture) // 配置error图标 如果不介意使用lib自带的图标,并不一定要调用这个API

.setOnPictureLongPressListener(this)//长安监听,并不一定要调用这个API

.setOnStateChangedListener(new ImageWatcher.OnStateChangedListener() {

@Override

public void onStateChangeUpdate(ImageWatcher imageWatcher, ImageView clicked, int position, Uri uri, float animatedValue, int actionTag) {

Log.e("IW", "onStateChangeUpdate [" + position + "][" + uri + "][" + animatedValue + "][" + actionTag + "]");

}

@Override

public void onStateChanged(ImageWatcher imageWatcher, int position, Uri uri, int actionTag) {

if (actionTag == ImageWatcher.STATE_ENTER_DISPLAYING) {

Toast.makeText(getApplicationContext(), "点击了图片 [" + position + "]" + uri + "", Toast.LENGTH_SHORT).show();

} else if (actionTag == ImageWatcher.STATE_EXIT_HIDING) {

Toast.makeText(getApplicationContext(), "退出了查看大图", Toast.LENGTH_SHORT).show();

}

}

})

.setIndexProvider(new CustomDotIndexProvider())//自定义页码指示器(默认数字),并不一定要调用这个API

.setLoadingUIProvider(new CustomLoadingUIProvider()); // 自定义LoadingUI,并不一定要调用这个API

由于一般图片查看会占据全屏

持有activity引用后 调用activity.getWindow().getDecorView()拿到根FrameLayout

即可动态插入ImageWatcher -> 使用

非入侵式 不再需要在布局文件中加入标签 减少布局嵌套

这个时候你的所有准备工作已经完成

/**

* @param i 被点击的ImageView

* @param imageGroupList 被点击的ImageView的所在列表,加载图片时会提前展示列表中已经下载完成的thumb图片

* @param urlList 被加载的图片url列表,数量必须大于等于 imageGroupList.size。 且顺序应当和imageGroupList保持一致

*/

public void show(ImageView i, SparseArray imageGroupList, final List urlList) { ... }

最后只要调用 vImageWatcher.show() 方法就可以了

//记得重写返回键哦

@Override

public void onBackPressed() {

// //方式一

// if (!vImageWatcher.handleBackPressed()) {

// super.onBackPressed();

// }

//方式二

if (!iwHelper.handleBackPressed()) {

super.onBackPressed();

}

}

初始化API简介

name description

setLoader 图片地址加载的实现者

setTranslucentStatus 当没有使用透明状态栏,传入状态栏的高度

setErrorImageRes 图片加载失败时显示的样子

setOnPictureLongPressListener长按回调

setIndexProvider 自定义页码UI

setLoadingUIProvider 自定义加载UI

setOnStateChangedListener开始显示和退出显示时的回调

写在最后

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
大图查看,它能够动画顺畅切换查看状态,同样动画顺畅退出查看界面左右滑动多图查看仿微信下拽退出   示例下载在 previews文件夹下 app-debug.apk app-debug.apk对比之前1.0.3,修复-宽高计算错误导致起始图片位置显示错误。优化-取消了无意义的旋转,提示下拽体验(放大且图片已显示顶端时亦可下拽)。优化-支持显示本地图片。新增-支持长图显示(beta)。 使用的网络图片,被屏蔽了请自己换地址,或提醒我。新增-自定义loadingUI新增-自定义indexUI集成Add it in your root build.gradle at the end of repositories:allprojects {     repositories {         ...         maven { url 'https://jitpack.io' }     } }Add the dependencydependencies {     implementation 'com.github.iielse:ImageWatcher:1.1.0' }初始化API简介namedescription*setLoader*图片地址加载的实现者setTranslucentStatus当没有使用透明状态栏,传入状态栏的高度setErrorImageRes图片加载失败时显示的样子setOnPictureLongPressListener长按回调setIndexProvider自定义页码UIsetLoadingUIProvider自定义加载UIsetOnStateChangedListener开始显示和退出显示时的回调初始化配置Activity.onCreate()vImageWatcher = ImageWatcherHelper.with(this) // 一般来讲,ImageWatcher尺寸占据全屏     .setLoader(new GlideImageWatcherLoader()) // demo中有简单实现     .setIndexProvider(new DotIndexProvider()) // 自定义     .create();Activity.onBackPressed()if (!vImageWatcher.handleBackPressed()) {     super.onBackPressed(); }使用ImageView clickedImage = 被点击的ImageView; SparseArray<ImageView> mapping = new SparseArray<>(); // 这个请自行理解, mapping.put(0, clickedImage); List<Uri> dataList = 被显示的图片们; vImageWatcher.show(clickedImage, mapping, dataList);具体看源码demo示例。项目可运行。欢迎提出问题/想法。楼主也许可能会更新,比如这次 /斜眼笑。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值