Fresco加载gif不能显示问题解决

1.Fresco引发的血案

前面写过一篇关于Fresco分析的文章，没想到没过几天就发生了一场血案。事情是这样的，昨天另一个小哥跟我说他用Fresco加载gif不能显示了，他也不知道为什么，也没改什么东西，让我帮忙看一下。其实我们项目用Fresco已经挺久的了，然后之前那个地方也没有问题，但是不知道为什么就是不显示了。于是今天就开始了折腾。

2.解决过程

1.首先我怀疑是不是改了布局，导致控件没有显示出来。带着这样的怀疑，我设置了控件的背景为鲜明的红色，发现是显示出来的，并没有什么问题。当然这个想法可能太简单了点，但是这样的原因也是很有可能的，所以当一个控件不能显示的时候，你一定要先确定改控件是不是Visible，如果是Visible那么再去找其他原因。

2.怀疑加载图片的URI有问题，通过跟踪AbstractDraweeController中的
submitRequest()方向作为入口，不断跟踪到如下图的地方，发现URI正确，且正确调用的相应的方法。

这里写图片描述

既然url没有错，那我看看submit中的回调吧，如下图，妈蛋居然调的是失败，这我就懵逼了，这tm到底哪里出错了呢，就错了也不是咱自己的错吧，这锅不得facebook来背吗？但以我多年的职业经验来看这个事情不是那么简单，于是我继续断点反复查看。我们通过对Fresco的分析会发现，最终在处理请求时都会调用Producer类中的的produceResults来消费请求，但是对于这个Producer我也不是很懂，但是就凭他要调用的这个方法，我断点逐行分析，发现并没有什么问题。最终个条路也只能到这里结束。

这里写图片描述

3.实在没什么头绪了，于是去查看Fresco的文档http://www.fresco-cn.org/docs/getting-started.html,文档中关于加载gif的描述如下：

Uri uri;
DraweeController controller = Fresco.newDraweeControllerBuilder()
.setUri(uri)
.setAutoPlayAnimations(true)
. // 其他设置（如果有的话）
.build();
mSimpleDraweeView.setController(controller);

这代码这么简单没什么问题啊。继续看文档，发现在问题处理中说可以启动日志，既然没有办法那就启动日志来看看呗。Fresco日志默认是关闭的，启动日志方法如下，在Fresco初始化时做如下配置：

Set requestListeners = new HashSet<>();
requestListeners.add(new RequestLoggingListener());
ImagePipelineConfig config = ImagePipelineConfig.newBuilder(context)
// other setters
.setRequestListeners(requestListeners)
.build();
Fresco.initialize(context, config);
FLog.setMinimumLoggingLevel(FLog.VERBOSE);

查看日志方法如下：

adb logcat -v threadtime | grep -iE 'LoggingListener|AbstractDraweeController|BufferedDiskCache'

ok打开日志后，再次加载，看到如下日志：

这里写图片描述

什么意思呢？大概就是在DecodeProducer中有一个空指针异常，调用了decodeGif在一个空引用上。于是查看DecodeProducer类找到doDecode方法，发现其中调用了mImageDecoder.decodeImage，继续查看在decodeImage中调用到了我们要找的decodeGif方法，内容如下：

这里写图片描述

根据这个方法再打断点说的就是这个mAnimatedImageFactory是空指针，那么这个AnimatedImageFactory是个什么鬼，从源码我可以知道这个类就是用来解析动图的，目前可以解析gif和webP。 继续查看调用可以看到这个factory是在ImagePipeline中创建的，如下：

这里写图片描述

就是在这里通过AnimatedFactoryProvider创建了一个AnimatedFactory，里面代码如下：

这里写图片描述

通过反射来创建的，既然出现了空指针那就是这里创建的问题咯，那我们来看看这个两个类，发现根本找不到，所以问题就是这里咯。同时发现在项目中存在两个Fresco的包0.8.0和0.11.0，于是定位到可能是依赖冲突的原因。查看了0.8.0里面创建AnimatedFactory的代码发现与0.11.0中的代码还是有点区别的，确认是依赖包冲突的问题了。

这里写图片描述

通过在Android studio Terminal输入如下命令gradlew -q app:dependencies查看当前使用的依赖版本,发现虽然配置的是使用0.8.0但是实际使用的却是0.11.0。所以解决办法1就是恢复到0.8.0版本，至于11版本的为什么没有那两个类我们稍后再来看。

+--- com.facebook.fresco:fresco:0.8.0 -> 0.11.0
|    +--- com.facebook.fresco:drawee:0.11.0
|    |    +--- com.android.support:support-v4:23.2.1 (*)
|    |    \--- com.facebook.fresco:fbcore:0.11.0
|    +--- com.facebook.fresco:fbcore:0.11.0
|    \--- com.facebook.fresco:imagepipeline:0.11.0
|         +--- com.android.support:support-v4:23.2.1 (*)
|         +--- com.facebook.fresco:fbcore:0.11.0
|         +--- com.parse.bolts:bolts-tasks:1.4.0
|         +--- com.nineoldandroids:library:2.4.0
|         \--- com.facebook.fresco:imagepipeline-base:0.11.0
|              +--- com.android.support:support-v4:23.2.1 (*)
|              +--- com.facebook.fresco:fbcore:0.11.0
|              +--- com.parse.bolts:bolts-tasks:1.4.0
|              \--- com.nineoldandroids:library:2.4.0

+--- com.facebook.react:react-native:0.29.2
|    +--- com.google.code.findbugs:jsr305:3.0.0
|    +--- org.webkit:android-jsc:r174650
|    +--- com.facebook.fresco:imagepipeline-okhttp3:0.11.0
|    |    +--- com.facebook.fresco:fbcore:0.11.0
|    |    +--- com.squareup.okhttp3:okhttp:3.0.1 -> 3.2.0
|    |    |    \--- com.squareup.okio:okio:1.6.0 -> 1.8.0
|    |    \--- com.facebook.fresco:imagepipeline:0.11.0 (*)
|    +--- com.squareup.okio:okio:1.8.0
|    +--- com.fasterxml.jackson.core:jackson-core:2.2.3
|    +--- com.squareup.okhttp3:okhttp:3.2.0 (*)
|    +--- com.facebook.fresco:fresco:0.11.0 (*)
|    +--- com.squareup.okhttp3:okhttp-ws:3.2.0
|    |    \--- com.squareup.okhttp3:okhttp:3.2.0 (*)
|    +--- com.android.support:recyclerview-v7:23.0.1 (*)
|    +--- com.squareup.okhttp3:okhttp-urlconnection:3.2.0
|    |    \--- com.squareup.okhttp3:okhttp:3.2.0 (*)
|    \--- com.android.support:appcompat-v7:23.0.1 (*)

从上面的依赖关系可以看出我们自己依赖了fresco的0.8，同时依赖了react，但是react中依赖了fresco 0.11导致我们实际依赖的是搞版本的fresco，所以如果要使用低版本的，按理说只需要把react中的fresco排除，然后我们在导入自己需要的版本就行了，但是我按照这样的思路在build.gradle进行了如下配置，结果还是使用11版本的，最终没有找到原因，你们也可以试一下，如果有发现什么问题的一定要告诉我。

compile 'com.facebook.fresco:fresco:0.8.0'
compile ('com.facebook.react:react-native:0.29.2') {
   exclude module:'com.facebook.fresco:fresco'
}

接下来我们就来看看为什么使用11版本的就少了那两个类呢？查阅各种资料，最终在一篇博客中发现了如下的内容：

一定要导入下边这个 compile 'com.facebook.fresco:animated-gif:0.12.0'，否则gif图压根不动

于是瞬间懂了，原来高版本的fresco把gif相关的内容独立到了另一个依赖里面，这样如果不需要用到gif的项目就不需要导入，由于我们升级到了高版本，所以默认是没有gif相关的类的，所以就缺少了那两个类，导致gif不能显示，于是导入后，完美解决问题。

3.总结

解决问题的方法有两种：
1.退回到低版本的fresco
2.使用高版本的，需要另外导入com.facebook.fresco:animated-gif这个依赖

参考资料
gradle 管理依赖库两个问题
fesco加载gif类似问题