Fresco简介

简介:由Facebook最新推出的一款用于Android应用中展示图片的强大图片库,采用MVC设计模式。(被誉为最好的图片处理框架,facebook出品,必出精品 )

优势:底层直接用的是C语言,所以对于内存的管理特别强大,一张图片如果 picasso 来处理要用80%的话,那么fresco只占40%,必须使用它的自定义控件,设置src属性,可以直接引用GIF...,各方面都不用管的.一句话越早接触越好.

Fresco中的image pipeline模块。负责从网络，从本地文件系统，本地资源加载图片。为了最大限度节省空间和CPU时间，它含有3级缓存设计（2级内存，1级文件）。

Fresco中的Drawees 模块，显示loading图，当图片不再显示在屏幕上时，及时地释放内存和空间占用。

五大特点
内存管理:在5.0以下系统，Fresco将图片放到一个特别的内存区域。然而,在图片不显示的时候，占用的内存会自动被释放。这会使得APP更加流畅，减少因图片内存占用而引发的OOM.( 内存分配采用：系统匿名共享内存 )

渐进式呈现图片:渐进式图片格式先呈现大致的图片轮廓，然后随着图片下载的继续,呈现逐渐清晰的图片，在网速慢的情况下有极大的优越性，可带来更好的用户体验。

支持加载Gif图，支持WebP格式。

图像的呈现:

（1）自定义居中焦点(对人脸等图片显示非常有帮助)。

（2）圆角图，当然圆圈也行。

（3）下载失败之后，点击重新下载。

（4）自定义占位图，自定义overlay, 或者进度条。

（5）指定用户按压时的overlay。

图像的加载:（1）为同一个图片指定不同的远程路径，或者使用已经存在本地缓存中的图片。（2）先显示一个低解析度的图片，等高清图下载完毕再显示高清图。（3）加载完成回调通知。（4）对于本地图，如有EXIF缩略图，在大图加载完成之前，可先显示缩略图。（5）缩放或者旋转图片。（6）处理已下载的图片。

作用:带进度条的图片、图片的不同裁剪、圆形和圆角图片、渐进式展示图片、Gif动画图片、多图请求及图片复用、图片加载监听、图片缩放和旋转、修改图片和动态展示.

依赖库下载:https://github.com/facebook/fresco 使用说明API文档: https://www.fresco-cn.org/docs/index.html
Fresco各项功能总结文章: http://blog.csdn.net/u011771755/article/details/47608191

(对应代码地址:https://github.com/NateRobinson/FrescoStudyDemo)

支持加载图片的路径:1.远程图片(http://, https://)

2.本地文件(file://) 3.Content provider(content://)

4.asset目录下的资源(asset://)

5. res目录下的资源( res:// )

6. Uri中指定图片数据( data:mime/type;base64, )

常用API

android:layout_width="20dp": 不支持wrap_content，如果要设置宽高比, 需要在Java代码中指定setAspectRatio(float ratio);

android:layout_height="20dp" : 不支持wrap_content

fresco:placeholderImage="@color/wait_color": 下载成功之前显示的图片

fresco:placeholderImageScaleType="fitCenter": 设置图片缩放. 通常使用focusCrop,该属性值会通过算法把人头像放在中间

fresco:failureImage="@drawable/error": 加载失败的时候显示的图片

fresco:failureImageScaleType=“centerInside": 设置图片缩放

fresco:retryImage="@drawable/retrying": 加载失败,提示用户点击重新加载的图片(会覆盖failureImage的图片)

fresco:roundAsCircle="true": 设置圆形方式显示图片

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" 圆角设置

使用Fresco注意事项:

问题及处理:

1）重复的边界:这是使用圆角的一个缺陷。

2）图片没有加载:你可以从 image pipeline 打出的日志来查看原因。这里提供一些通常会导致问题的原因:

3）文件不可用:无效的路径、链接会导致这种情况。

判断网络链接是否有效，你可以尝试在浏览器中打开它，看看是否图片会被加载。若图片依然加载不出来，那么这不是Fresco的问题。

判断本地文件是否有效，你可以通过下面这段代码来校验：

FileInputStream fis = new FileInputStream(new File(localUri.getPath()));

如果这里抛出异常，那么这不是Fresco的问题，可能是你的其他代码导致的。有可能是没有获取到SD卡读取权限、路径不合法、文件不存在等。

4）OOM - 无法分配图片空间 :加载特别特别大的图片时最容易导致这种情况。如果你加载的图片比承载的View明显大出太多，那你应该考虑将它Resize一下。

5）Bitmap太大导致无法绘制:Android 无法绘制长或宽大于2048像素的图片。这是由OpenGL渲染系统限制的，如果它超过了这个界限，Fresco会对它进行Resize。

6）通过Logcat来判断原因:在加载图片时会出现各种各样的原因导致加载失败。使用Fresco时，最直接的方式就是查看 image pipeline 打出的VERBOSE级别日志。

7）启动日志:默认情况下Fresco是关闭日志输出的，你可以配置image pipeline让它启动.

Set<RequestListener> 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);

8）查看日志:你可以通过下面这条shell命令来查看Fresco日志：

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

它的输出为如下格式：

08-12 09:11:15.162 6690 6742 V unknown:BufferedDiskCache: About to write to disk-cache for key http://www.example.com/image.jpg

08-12 09:11:15.162 6690 6734 V unknown:RequestLoggingListener: time 11202162: onProducerStart: {requestId: 1, producer: DecodeProducer}

08-12 09:11:15.163 6690 6742 V unknown:BufferedDiskCache: Successful disk-cache write for key http://www.example.com/image.jpg

08-12 09:11:15.169 6690 6734 V unknown:RequestLoggingListener: time 11202169: onProducerFinishWithSuccess: {requestId: 1, producer: DecodeProducer, elapsedTime: 7 ms, extraMap: {hasGoodQuality=true, queueTime=0, bitmapSize=600x400, isFinal=true}}

08-12 09:11:15.169 6690 6734 V unknown:RequestLoggingListener: time 11202169: onRequestSuccess: {requestId: 1, elapsedTime: 378 ms}

08-12 09:11:15.184 6690 6690 V unknown:AbstractDraweeController: controller 28ebe0eb 1: set_final_result @ onNewResult: image: CloseableReference 2fd41bb0

在这个示例中，我们发现名为28ebe0eb的 DraweeView 向名为36e95857的 DataSource 进行了图像请求。首先，图片没有在内存缓存中找到，也没有在磁盘缓存中找到，最后去网络上下载图片。下载成功后，图片被解码，之后请求结束。最后数据源通知 controller 图片就绪，显示图片(set_final_result）。

陷阱:

1）不要使用 ScrollViews :如果你想要在一个长的图片列表中滑动，你应该使用 RecyclerView，ListView，或 GridView。这三者都会在你滑动时不断重用子视图。Fresco 的 view 会接收系统事件，使它们能正确管理内存。

ScrollView 不会这样做。因此，Fresco view 不会被告知它们是否在屏幕上显示，并保持图片内存占用直到你的 Fragment 或 Activity 停止。你的 App 将会面临更大的 OOM 风险。

2）不要向下转换:不要试图把Fresco返回的一些对象进行向下转化，这也许会带来一些对象操作上的便利，但是也许在后续的版本中，你会遇到一些因为向下转换特性丢失导致的难以处理的问题。

3）不要使用getTopLevelDrawable:DraweeHierarchy.getTopLevelDrawable() 仅仅只应该在DraweeViews中用，除了定义View中，其他应用代码建议连碰都不要碰这个。

在自定义view中，也千万不要将返回值向下转换，也许下个版本，我们会更改这个返回值类型。

4）不要复用 DraweeHierarchies:永远不要把 DraweeHierarchy 通过 DraweeView.setHierarchy 设置给不同的View。DraweeHierarchy 是由一系列 Drawable 组成的。在 Android 中, Drawable 不能被多个 View 共享。

5）不要在多个DraweeHierarchy中使用同一个Drawable:原因同上。不过你可以在占位图、重试图、错误图中使用相同的资源ID，Android 实际会创建不同的 Drawable。如果你使用GenericDraweeHierarchyBuilder，那么需要调用Resources.getDrawable来通过资源获取图片。不过请不要只调用一次然后将结果传给不同的Hierarchy！

6）不要直接控制 hierarchy:不要直接使用 SettableDraweeHierarchy 方法(reset，setImage，…)。它们应该仅由 controller 使用。不要使用setControllerOverlay来设置一个覆盖图，这个方法只能给 controller 调用。如果你需要显示覆盖图，可以参考Drawee的各种效果配置

7）不要直接给 DraweeView 设置图片:目前 DraweeView 直接继承于 ImageView，因此它有 setImageBitmap, setImageDrawable 等方法。

如果利用这些方法直接设置一张图片，内部的 DraweeHierarchy 就会丢失，也就无法取到image pipeline 的任何图像了。

8）使用 DraweeView 时，请不要使用任何 ImageView 的属性:在后续的版本中，DraweeView 会直接从 View 派生。任何属于 ImageView 但是不属于 View 的方法都会被移除。

人们经常会问，为什么Fresco中不可以使用wrap_content？

主要的原因是，Drawee永远会在getIntrinsicHeight/getIntrinsicWidth中返回-1。

这么做的原因是 Drawee 不像ImageView一样。它同一时刻可能会显示多个元素。比如在从占位图渐变到目标图时，两张图会有同时显示的时候。再比如可能有多张目标图片（低清晰度、高清晰度两张）。如果这些图像都是不同的尺寸，那么很难定义”intrinsic”尺寸。

如果我们要先用占位图的尺寸，等加载完成后再使用真实图的尺寸，那么图片很可能显示错误。它可能会被根据占位图的尺寸来缩放、裁剪。唯一防止这种事情的方式就只有在图片加载完成后强制触发一次layout。这样的话不仅会影响性能，而且会让应用的界面突变，很影响用户体验！如果用户正在读一篇文章，然后在图片加载完成后整篇文章突然向下移动，这是非常不好的。

所以你必须指定尺寸或者用match_parent来布局。

你如果从服务端请求图片，服务端可以做到返回图片尺寸。然后你拿到之后通过setLayoutParams 来给View设置宽高。

当然如果你必须要使用wrap_content，那么你可以参考StackOverflow上的一个回答。但是我们以后会移除这个功能，Ugly things should look ugly。

共享元素动画

使用 ChangeBounds，而不是ChangeImageTransform

Android 5.0 (Lollipop) 引入了共享元素动画，允许在多个Activity切换时共享相同的View！

你可以在XML中定义这个变换。有个ChangeImageTransform变换可以在共享元素切换时对ImageView进行变换，可惜Fresco暂时不支持它，因为Drawee维护着自己的转换Matrix。

幸运的是你可以有另一种做法：使用ChangeBounds。你可以改变layout的边界，这样Fresco会根据它进行自适应，也能够达到你想要的功能。