Android图片加载框架之Fresco

Facebook应该没人没听过吧?嗯,今天学的这个Fresco就来源于它。Fresco相比PicassoGlide来说就来得重量级一点了,当然功能也会更加强大,废话少说,开撸

特性

强大的内存管理

大家都知道Bitmap占用内存过大经常是导致程序OOM的元凶,同时也会引起系统频繁的GC,在5.0系统一下会显著引发界面卡顿。Fresco在5.0以下系统里使用了一块特别的区域来存放图片,减少OOM以及使App更加流畅

可定制的图片加载方式

  • 为同一个图片指定不同的远程路径,或者使用已经存在本地缓存中的图片
  • 先显示一个低清晰度的图片,等高清图下载完之后再显示高清图
    加载完成回调通知
  • 对于本地图,如有EXIF缩略图,在大图加载完成之前,可先显示缩略图
    缩放或者旋转图片
  • 对已下载的图片再次处理
  • 支持WebP解码,即使在早先对WebP支持不完善的Android系统上也能正常使用!

图片绘制

  • 自定义居中焦点
  • 圆角图,当然圆圈也行
  • 下载失败之后,点击重现下载
  • 自定义占位图,自定义overlay, 或者进度条
  • 指定用户按压时的overlay

加载渐进式图片

渐进式图片格式先呈现大致的图片轮廓,然后随着图片下载的继续,呈现逐渐清晰的图片,这对于移动设备,尤其是慢网络有极大的利好,可带来更好的用户体验。
  Android 本身的图片库不支持此格式,但是Fresco支持。

加载动图

加载Gif图和WebP动图在任何一个Android开发者眼里看来都是一件非常头疼的事情。每一帧都是一张很大的Bitmap,每一个动画都有很多帧。Fresco让你没有这些烦恼,它处理好每一帧并管理好你的内存。

项目地址

https://github.com/facebook/fresco

使用方法

http://fresco-cn.org/docs/index.html

Gradle依赖:

compile 'com.facebook.fresco:fresco:0.13.0'

初始化Fresco:

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

Fresco使用前必须进行初始化,因为多次调用初始化毫无意义,所以在Application里面做这件事再适合不过了。然后在AndroidManifest.xml指定Application 类,并确保已加入了网络权限。

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

类MVC的三大组件:

  • V:DraweeView
  • M:DraweeHierachy
  • C:DraweeController

Fresco不像别的很多框架只是用来下载和缓存图片显示由ImageView负责,它有自己的一套显示图片的控件,即DraweeView:

<com.facebook.drawee.view.SimpleDraweeView
    android:id="@+id/draweeView"
    xmlns:fresco="http://schemas.android.com/apk/res-auto"
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:layout_centerInParent="true" />

DraweeView有丰富的可配置参数:

fresco:actualImageScaleType="focusCrop"

fresco:placeholderImage="@drawable/icon_placeholder"
fresco:placeholderImageScaleType="fitCenter"

fresco:progressBarImage="@drawable/icon_progress_bar"
fresco:progressBarImageScaleType="centerInside"
fresco:progressBarAutoRotateInterval="5000"

fresco:failureImage="@drawable/icon_failure"
fresco:failureImageScaleType="centerInside"

fresco:retryImage="@drawable/icon_retry"
fresco:retryImageScaleType="centerCrop"

fresco:fadeDuration="5000"

fresco:roundedCornerRadius="30dp"
fresco:roundTopLeft="true"
fresco:roundTopRight="true"
fresco:roundBottomLeft="true"
fresco:roundBottomRight="true"
fresco:roundingBorderWidth="10dp"
fresco:roundingBorderColor="@android:color/black"
fresco:roundWithOverlayColor="@android:color/darker_gray"
fresco:roundAsCircle="true"

fresco:backgroundImage="@android:color/holo_orange_light"

fresco:pressedStateOverlayImage="@android:color/holo_green_dark"

fresco:overlayImage="@android:color/black"

DraweeView可以配置placeholder、进度条、圆角等等。
如果仅仅是想简单下载一张网络图片,在下载完成之前,显示一张占位图,那么简单使用 SimpleDraweeView即可。

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

DraweeHierarchy用来配置DraweeView的参数,类似于xml中配置的参数:

GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())
        .setPlaceholderImage(ContextCompat.getDrawable(this, R.drawable.icon_placeholder), ScalingUtils.ScaleType.CENTER_CROP)
        .setProgressBarImage(ContextCompat.getDrawable(this, R.drawable.icon_progress_bar), ScalingUtils.ScaleType.CENTER_INSIDE)
        .build();

再来段设置圆角的:

RoundingParams roundingParams = new RoundingParams();

roundingParams.setCornersRadii(new float[]{55, 25, 30, 35, 40, 45, 50, 55})
        .setRoundAsCircle(true)
        .setBorder(Color.RED, 10)
        .setOverlayColor(Color.BLUE)
        .setRoundingMethod(RoundingParams.RoundingMethod.BITMAP_ONLY);
//      .setRoundingMethod(RoundingParams.RoundingMethod.OVERLAY_COLOR);

GenericDraweeHierarchy hierarchy = GenericDraweeHierarchyBuilder.newInstance(getResources())
//      .setRoundingParams(RoundingParams.asCircle())
//      .setRoundingParams(RoundingParams.fromCornersRadius(200))
//      .setRoundingParams(RoundingParams.fromCornersRadii(200, 0, 200, 200))
//      .setRoundingParams(RoundingParams.fromCornersRadii(new float[]{55, 25, 30, 35, 40, 45, 50, 55}))
        .setRoundingParams(roundingParams)
        .setFadeDuration(5000)
        .build();

DraweeController用来控制DraweeView的行为,如Uri地址、是否开启点击重试等:

DraweeController controller = Fresco.newDraweeControllerBuilder()
        .setUri(uri)
        .setTapToRetryEnabled(true)
        .setOldController(simpleDraweeView.getController())
        .build();

最后是给DraweeView设置DraweeHierarchy和DraweeController:

simpleDraweeView.setHierarchy(hierarchy);
simpleDraweeView.setController(controller);

参考链接:
Android图片加载神器之Fresco-加载图片基础[详细图解Fresco的使用]

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,547评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,399评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,428评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,599评论 1 274
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,612评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,577评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,941评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,603评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,852评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,605评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,693评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,375评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,955评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,936评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,172评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,970评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,414评论 2 342

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,398评论 25 707
  • Fresco简单的使用—SimpleDraweeView 百学须先立志—学前须知: 在我们平时加载图片(不管是下载...
    天天大保建阅读 3,402评论 0 8
  • 这件事算是现在进行时吧,从前一个星期开始到现在,仍在发生。几天前的傍晚,饭后闲聊,妈妈说在门口的半坡儿上有个乞丐老...
    与风祈愿阅读 629评论 1 2
  • 亲爱的老公: 和你在一起两年有余了,但我们真正相识已经10年了,想起以往嘴角情不自禁略微向上,不是觉得可笑,可能就...
    Amor相依阅读 155评论 0 2
  • 晨雾凌波杨风摆, 金毡玉梭秋轮转。 暮沉光隐丽光褪, 似水月华娴静子。 披雪莲芽杨先迎, 泪挂涡漩怡先笑。 农醉茅...
    cjp安乐窝阅读 464评论 0 3