Fresco加载图片使用笔记--基本使用，播放动态wbep，控制播放次数，预加载，闪帧解决

1. 简单使用
2. 属性控制
3. 播放动态webp
4. 监听webp播放及控制webp播放次数
5. 预取图片
6. 连续加载多张动图闪帧解决方案

1. 简单使用

1）添加依赖：

dependencies {//必须添加implementation 'com.facebook.fresco:fresco:1.9.0'//依需要添加// For animated GIF supportimplementation 'com.facebook.fresco:animated-gif:1.9.0'// For WebP support, including animated WebPimplementation 'com.facebook.fresco:animated-webp:1.9.0'implementation 'com.facebook.fresco:webpsupport:1.9.0'// For WebP support, without animationsimplementation 'com.facebook.fresco:webpsupport:1.9.0'// Provide the Android support library (you might already have this or a similar dependency)implementation 'com.android.support:support-core-utils:24.2.1'
}

2）Application中初始化
在你AndroidManifest中指定的Application的onCreate方法中初始化，如果没有指定，需要继承并指定。

public class MyApplication extends Application {@Overridepublic void onCreate() {super.onCreate();Fresco.initialize(this);}
}

 <manifest... ><application...android:label="@string/app_name"android:name=".MyApplication">...</application>...</manifest>

3）编写xml,记得指定fresco命名空间，需要注意的是SimpleDraweeView必须指定确定大小，不支持wrap_content

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

<com.facebook.drawee.view.SimpleDraweeViewandroid:id="@+id/my_image_view"android:layout_width="130dp"android:layout_height="130dp"fresco:placeholderImage="@drawable/my_drawable" />

4）指定Uri

Uri uri = Uri.parse("https://raw.githubusercontent.com/facebook/fresco/master/docs/static/logo.png");
SimpleDraweeView draweeView = (SimpleDraweeView) findViewById(R.id.my_image_view);
draweeView.setImageURI(uri);

或直接在xml中指定
fresco:actualImageUri
fresco:actualImageResource

Fresco 不支持相对路径的URI. 所有的 URI 都必须是绝对路径，并且带上该 URI 的 scheme。

2. 属性控制

属性都基本可以在xml和代码中控制，见文生义，这里就不详细解释了

<com.facebook.drawee.view.SimpleDraweeViewandroid:id="@+id/my_image_view"android:layout_width="20dp"android:layout_height="20dp"fresco:fadeDuration="300"fresco:actualImageScaleType="focusCrop"fresco:placeholderImage="@color/wait_color"fresco:placeholderImageScaleType="fitCenter"fresco:failureImage="@drawable/error"fresco:failureImageScaleType="centerInside"fresco:retryImage="@drawable/retrying"fresco:retryImageScaleType="centerCrop"fresco:progressBarImage="@drawable/progress_bar"fresco:progressBarImageScaleType="centerInside"fresco:progressBarAutoRotateInterval="1000"fresco:backgroundImage="@color/blue"fresco:overlayImage="@drawable/watermark"fresco:pressedStateOverlayImage="@color/red"fresco:roundAsCircle="false"fresco:roundedCornerRadius="1dp"fresco:roundTopLeft="true"fresco:roundTopRight="false"fresco:roundBottomLeft="false"fresco:roundBottomRight="true"fresco:roundWithOverlayColor="@color/corner_color"fresco:roundingBorderWidth="2dp"fresco:roundingBorderColor="@color/border_color"
/>

3. 播放动态webp

1)自动播放：

Uri uri;
DraweeController controller = Fresco.newDraweeControllerBuilder().setUri(uri).setAutoPlayAnimations(true). // 其他设置.build();
mSimpleDraweeView.setController(controller);

2）手动控制播放播放

ControllerListener controllerListener = new BaseControllerListener<ImageInfo>() {@Overridepublic void onFinalImageSet(String id,@Nullable ImageInfo imageInfo,@Nullable Animatable anim) {if (anim != null) {// 其他控制逻辑，可以在此处设置图片加载结束的标志位anim.start();}}
};Uri uri;
DraweeController controller = Fresco.newDraweeControllerBuilder().setUri(uri).setControllerListener(controllerListener)// 其他设置.build();
mSimpleDraweeView.setController(controller);

使用animatable.start()开始播放动画，animatable.stop()停止播放动画

4. 控制动态webp播放次数，监听webp播放，获取动图时长

1）控制播放次数
需添加依赖：
implementation 'com.facebook.fresco:animated-drawable:1.9.0'

final DraweeController controller = Fresco.newDraweeControllerBuilder().setAutoPlayAnimations(true).setUri(uri).setControllerListener(new BaseControllerListener<ImageInfo>() {@Overridepublic void onFinalImageSet(String id,@Nullable ImageInfo imageInfo,@Nullable Animatable animatable) {if (animatable instanceof AnimatedDrawable2) {AnimatedDrawable2 animatedDrawable = (AnimatedDrawable2) animatable;animatedDrawable.setAnimationBackend(new LoopCountModifyingBackend(animatedDrawable.getAnimationBackend(), 3));//设置循环次数}}}).build();
simpleDraweeView.setController(controller);

public class LoopCountModifyingBackend extends AnimationBackendDelegate {private int mLoopCount;public LoopCountModifyingBackend(@Nullable AnimationBackend animationBackend,int loopCount) {super(animationBackend);mLoopCount = loopCount;}@Overridepublic int getLoopCount() {return mLoopCount;}
}

2）监听动态webp

animatedDrawable.setAnimationListener()

animaetdDrawable是AnimatedDrawable2的实例

3）获取动图时长

animatedDrawable.getLoopDurationMs()

其它的还有：

animatedDrawable.getFrameCount()//获取帧数
animatedDrawable.getLoopCount()//获取循环次数

5. 预取图片/预加载图片

获取ImagePipeline:

Fresco.getImagePipeline()

获取ImageRequest

ImageRequest.fromFile(file);
ImageRequest.fromUri(uri);

预加载到磁盘缓存:

imagePipeline.prefetchToDiskCache(imageRequest, callerContext);

预加载到内存缓存:

imagePipeline.prefetchToBitmapCache(imageRequest, callerContext);

取消预加载:

DataSource<Void> prefetchDataSource = imagePipeline.prefetchTo...;
prefetchDataSource.close();

6. 连续播放多张动图闪帧解决方案

连续播放多张动图，中间会有几十毫秒的加载间隔。
本来想将动态webp缓存到内存，后来发现行不通，动态的webp貌似无法缓存到内存。
最后另辟蹊径，才用setPlaceHolder(),使其先显示的是动图的第一帧，解决问题。
代码如下：

 GenericDraweeHierarchyBuilder builder = new GenericDraweeHierarchyBuilder(getResources());
/*设置placeholder，减少连续加载两个动图时的间隙，同时设置渐变时间为0,动态webp不会缓存到内存*/
GenericDraweeHierarchy hierarchy = builder.setPlaceholderImage(ResourcesCompat.getDrawable(getResources(), drawableId, null)).setFadeDuration(0).build();DraweeController controller = Fresco.newDraweeControllerBuilder().setUri(uri).setControllerListener(controllerListener).build();
mSimpleDraweeView.setHierarchy(hierarchy);
mSimpleDraweeView.setController(controller);

需要注意的是，设置placeholder后，在播放下一张动图时，如果下一张动图没有设置placeholder，那么上一张的placeholder会闪一下，所以在加载下一张动图前需要设置placeholder或者将placeholder置为空。

refer：
http://frescolib.org/
https://www.fresco-cn.org/
https://github.com/facebook/fresco