Android 图片加载框架 Fresco 的使用

本文较短,阅读大约三分钟

Fresco这个框架和Glide,Picasso一样都比较流行,在性能上和使用上都比较完善,所以本篇将分享一下此框架的点点滴滴,希望大家喜欢。

Fresco是Facebook提供的开源图片加载库,它能够从网络,本地存储和Android资源文件中加载图片,且具有三级缓存设计(2级内存,1级文件),我们并不需要再去关心图片的加载和显示这些繁琐的事情,这是他的官网所描述的:

https://www.fresco-cn.org/

要想使用它我们可以可以循序渐进,先看下他的Github:

https://github.com/facebook/fresco

你想使用它的话,可以在 app/build.gradle 中添加如下依赖:

implementation 'com.facebook.fresco:fresco:1.13.0'

当然,这是最基础的,如果你还想额外支持Gif或者WebP的话是需要配置如下:

// 支持 GIF 动图,需要添加

implementation 'com.facebook.fresco:animated-gif:1.13.0'

// 支持 WebP (静态图+动图),需要添加

implementation 'com.facebook.fresco:animated-webp:1.13.0'

implementation 'com.facebook.fresco:webpsupport:1.13.0'

// 仅支持 WebP 静态图,需要添加

implementation 'com.facebook.fresco:webpsupport:1.13.0'

一.加载图片

我们如果想使用Fresco的话,首先就是初始化了,在我们的Application中的onCreate里初始化:Fresco.initialize(this);

然后添加一下网络权限,就可以在xml中使用SimpleDraweeView类来加载

加载图片的方式很简单:

mSimpleDraweeView=(SimpleDraweeView)findViewById(R.id.mSimpleDraweeView);

mSimpleDraweeView.setImageURI(Uri.parse(IMG_URL));

可以看到,只需要setImageURI即可完成显示效果,如图:

       Android 图片加载框架 Fresco 的使用      

这里要注意的是,SimpleDraweeView的高宽不能设置为wrap_content,因为Fresco加载的图片,下载的图片,缓存的图片可能尺寸并不相同,所以View可能会重新测量,导致无法显示的问题,如下代码:

     Android 图片加载框架 Fresco 的使用      

这只是最基本的加载方式,剩下的工作Fresco会帮你完成:

  • 显示占位图直到加载完成;

  • 下载图片;

  • 缓存图片;

  • 图片不再显示时,从内存中移除;

二.Fresco概念

我们只需要设置一下Url就可以完成显示工作,那么,这其中都是由谁来完成什么工作的呢?这个概念大家可以了解一下。

DraweeView

继承于View, 负责图片的显示。

一般情况下,使用 SimpleDraweeView 即可。 你可以在 XML 或者在 Java 代码中使用它,通过 setImageUri给它设置一个 URI 来使用

DraweeHierarchy

DraweeHierarchy 用于组织和维护最终绘制和呈现的Drawable对象

DraweeController

DraweeController 负责和 image loader 交互( Fresco 中默认为 image pipeline, 当然你也可以指定别的),可以创建一个这个类的实例,来实现对所要显示的图片做更多的控制。

如果你还需要对Uri加载到的图片做一些额外的处理,那么你会需要这个类的。

DraweeControllerBuilder

DraweeControllers 由 DraweeControllerBuilder 采用 Builder 模式创建,创建之后,不可修改

Listeners

使用 ControllerListener 的一个场景就是设置一个 Listener监听图片的下载。

所以在我们的认知中,Fresco 的 Image Pipeline 负责图片的获取和管理。图片可以来自远程服务器,本地文件,或者Content Provider,本地资源。压缩后的文件缓存在本地存储中,Bitmap数据缓存在内存中。

在5.0系统以下,Image Pipeline 使用 pinned purgeables 将Bitmap数据避开Java堆内存,存在ashmem中。这要求图片不使用时,要显式地释放内存。

SimpleDraweeView自动处理了这个释放过程,所以没有特殊情况,尽量使用SimpleDraweeView,在特殊的场合,如果有需要,也可以直接控制Image Pipeline。

Fresco支持的Uri格式很多,基本上大部分的都是支持的,可以查阅此链接查看:

https://www.fresco-cn.org/docs/supported-uris.html

三.在XML中使用Drawees

图片加载的可定制性非常的高,我们来看下官方的示例:

   //淡入淡出的动画持续时间

   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"

   //宽高比

   fresco:viewAspectRatio = "1.33f"

四.在Java中使用Drawees

在xml中只需要配置一下即可,如果在代码中,那么我们如何使用?实际上使用到的还是我们之前在概念中提到的DraweeControllerBuilder,来看下如下代码:

     Android 图片加载框架 Fresco 的使用      

在这段代码中我通过new一个GenericDraweeHierarchyBuilder后setRoundingParams方法,来调用参数类,最终设置给SimpleDraweeView,就得到了一个圆角的图片:

       Android 图片加载框架 Fresco 的使用      

当然,不止这一种用法,在xml中所用到的属性都是可以在java中实现的,这里就不一一赘述了,有兴趣的可以自己去看看使用方式。

如果想使用进度条来显示加载进度,可以通过

builder.setProgressBarImage(new ProgressBarDrawable());

的方式添加,当然,一般我们会自己去定义进度的加载

五.Gif的支持

Gif的支持需要增加依赖:

// 支持 GIF 动图,需要添加

implementation 'com.facebook.fresco:animated-gif:1.13.0'

代码比较简单

  Android 图片加载框架 Fresco 的使用      

加载Gif并且设置为自动播放即可。


Android 图片加载框架 Fresco 的使用

               

Fresco很强大,可定义包括支持的东西很多,这里就不一一介绍,你使用的话直接按照流程来即可, 相关功能可查阅:

https://www.fresco-cn.org/docs/using-drawees-xml.html

至此,我们本篇到这里就结束了。

有兴趣可以加入我的星球:Hi Android , 里面可都是我手撸的新鲜文章,高质量你值得拥有!

进入星球你可以做什么? 

1.我的所有视频可以观看

 2.发布提问贴可以得到满意的答案 

3.可指定我写你感兴趣的技术文章 

4.初学者可配套视频辅导 

5.有机会线下交流聚会

Android 图片加载框架 Fresco 的使用