Fresco

Posted 2020-08-17 安卓笔记侠

1、简介
Fresco是Facebook最新推出的一款用于android应用中展示图片的强大图片库，可以从网络、本地存储和本地资源中加载图片。相对于ImageLoader，拥有更快的图片下载速度以及可以加载和显示gif图等诸多优势，是个很好的图片框架。

 

2、特点
1）内存管理
在5.0以下系统，Fresco将图片放到一个特别的内存区域。当然，在图片不显示的时候，占用的内存会自动被释放。这会使得APP更加流畅，减少因图片内存占用而引发的OOM。
内存分配采用：系统匿名共享内存
2）渐进式呈现图片
渐进式图片格式先呈现大致的图片轮廓，然后随着图片下载的继续， 呈现逐渐清晰的图片，这对于移动设备，尤其是慢网络有极大的利好，可带来更好的用户体验。
3）支持加载Gif图，支持WebP格式。
4）图像的呈现
（1）自定义居中焦点(对人脸等图片显示非常有帮助)。
（2）圆角图，当然圆圈也行。
（3）下载失败之后，点击重新下载。
（4）自定义占位图，自定义overlay, 或者进度条。
（5）指定用户按压时的overlay。
5）图像的加载
（1）为同一个图片指定不同的远程路径，或者使用已经存在本地缓存中的图片。
（2）先显示一个低解析度的图片，等高清图下载完之后再显示高清图。
（3）加载完成回调通知。
（4）对于本地图，如有EXIF缩略图，在大图加载完成之前，可先显示缩略图。
（5）缩放或者旋转图片。
（6）处理已下载的图片。

3、下载地址
https://github.com/facebook/fresco
官方使用网址：
http://fresco-cn.org/docs/index.html

4、支持的URI
远程图片
http://, https://
本地文件
file://
Content provider
content://
asset目录下的资源
asset://
res目录下的资源
res://
Uri中指定图片数据
data:mime/type;base64,

5、常用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"
// 设置圆形方式显示图片
// 圆角设置

6、使用步骤
（1）添加依赖
（2）在application中初始化Fresco
（3）配置网络权限
<uses-permission android:name="android.permission.INTERNET"/>
（4）在xml布局文件中,加入命名空间
（5）在xml中引入SimpleDraweeView
（6）在Java代码中开始加载图片
注意：
如果项目中使用了OkHttp需要进行替换
For OkHttp2:
compile "com.facebook.fresco:imagepipeline-okhttp:0.12.0+"
For OkHttp3:
compile "com.facebook.fresco:imagepipeline-okhttp3:0.12.0+"

7、例子
0）项目准备
（1）布局
（2）代码
1）带进度条的图片
（1）布局
（2）代码
2）图片的不同裁剪
（1）布局
（2）代码设置
CENTER
CENTER_CROP
FOCUS_CROP
CENTER_INSIDE
FIT_CENTER
FIT_START
FIT_END
FIT_XY
none
（3）代码展示图片
3）圆形和圆角图片
（1）布局
（2）设置圆形图片
（3）设置圆角图片
4）渐进式展示图片
（1）布局
（2）代码
5）Gif动画图片
（1）布局
（2）添加依赖
compile ‘com.facebook.fresco:animated-gif:0.14.1‘
（3）代码
a)请求图片
b)开始动画
c)停止动画
6）多图请求及图片复用
（1）布局
（2）代码
a)先显示低分辨率的图，然后是高分辨率的图
b)本地缩略图预览
c)本地图片复用
7）图片加载监听
（1）布局
（2）代码
a)正常加载图片
b)加载过程监听
8）图片缩放和旋转
（1）布局
（2）代码
a)缩放
b)旋转
9）修改图片
（1）布局
（2）代码
10）动态展示图片
（1）布局
（2）代码

8、注意事项
1）问题处理
1）重复的边界
2）图片没有加载
3）文件不可用
4）OOM - 无法分配图片空间
5）Bitmap太大导致无法绘制
6）通过Logcat来判断原因
7）启动日志
8）查看日志
2）一些陷阱
1）不要使用 ScrollViews
2）不要向下转换
3）不要使用getTopLevelDrawable
4）不要复用 DraweeHierarchies
5）不要在多个DraweeHierarchy中使用同一个Drawable
6）不要直接控制 hierarchy
7）不要直接给 DraweeView 设置图片
8）使用 DraweeView 时，请不要使用任何 ImageView 的属性
3）为什么不支持wrap_content
4）共享元素动画

9、参考网站
http://blog.csdn.net/u011771755/article/details/47608191
https://github.com/NateRobinson/FrescoStudyDemo