强大的图片加载框架Fresco的使用

最新推荐文章于 2019-07-27 11:13:30 发布

原创最新推荐文章于 2019-07-27 11:13:30 发布 · 635 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#图片加载框架Fresco #图片加载框架 #Fresco

用法概括专栏收录该内容

123 篇文章

订阅专栏

本文详细介绍Fresco图片加载框架的使用方法，包括环境搭建、初始化配置、加载网络图片及自定义显示效果等。Fresco作为Facebook开源的强大图片加载库，在内存管理方面表现出色。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在图片异步加载的时候和ListView的滑动中，总会出现卡顿，这是因为图片的缓存做的不是足够到位，有使用Xutils框架下的图片加载，也有使用ImageLoader来实现，今天主要介绍一个当前最强大的图片加载框架——Fresco。

Fresco是Facebook发布的一款开源框架，号称是目前最强的Android图片加载库，在内存方面的表现极为优秀，既然有如此信心，
对于Fresco的一些介绍，就不多说了，如果你感兴趣肯定会到网上找一些相关的资料，建议你到官网查看：http://frescolib.org/。
当然了，国内的大神也对这个网站进行了翻译，如果你英语水平比较捉急，请到http://fresco-cn.org/来进行观摩，不过还是建议到官网，
因为你不知道什么时候会有更新，第三方的文档会不及时。

好了，话不多说，我相信酷爱安卓的你，和我一样，迫不及待。

1）添加依赖库。
目前git上的版本是0.11.0

dependencies
 {

    compile
 fileTree(include: ['*.jar'],
 dir: 'libs')

    testCompile 'junit:junit:4.12'

    compile 'com.android.support:appcompat-v7:23.4.0'

    compile 'com.facebook.fresco:fresco:0.11.0'

}

引入后andriod studio会自动加载远程库，如果没有开vpn的话，可能时间稍微会长些。

对于Eclipse的介绍的话这里就不多说了，比较麻烦，而且你会抛弃超级好用的亲儿子studio吗？

2）然后如果你是多次用到Fresco，建议在 Application 初始化，如果只是写着玩，就在应用调用 setContentView() 之前，进行初始化：

package com.example.nanchen.imageloadfrescodemo;

import android.app.Application;

import com.facebook.drawee.backends.pipeline.Fresco;

/**

 *
 Created by 南尘 on 2016/7/11.

 */

public class MyApplication extends Application
 {

    @Override

    public void onCreate()
 {

        super.onCreate();

        Fresco.initialize(this);

    }

}

3）因为我这里加载的是一张网络图片，所以要获得网络权限
<uses-permission android:name="android.permission.INTERNET"/>

4）用人家的框架就要按照人家的要求来是不，所以控件名字，命名空间都要听人家的
Fresco不同于其它几个图片加载库，它是基于自定义控件的，要使用控件SimpleDraweeView来显示图片，
注意，控件不支持宽高同时设置为wrap_content，默认强制设置宽高，否则不显示图片

<?xml
 version="1.0" encoding="utf-8"?>

<RelativeLayout

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

    xmlns:tools="http://schemas.android.com/tools"

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

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    tools:context="com.example.nanchen.imageloadfrescodemo.MainActivity">

    <!--<com.facebook.drawee.view.SimpleDraweeView-->

        <!--android:layout_width="50dp"-->

        <!--android:layout_height="50dp"-->

        <!--android:id="@+id/main_simple_drawee_view"-->

        <!--fresco:placeholderImage="@mipmap/ic_launcher"/>-->

    <com.facebook.drawee.view.SimpleDraweeView

        android:layout_width="400dp"

        android:layout_height="match_parent"

        android:id="@+id/main_simple_drawee_view"

        fresco:placeholderImage="@mipmap/ic_launcher"/>

</RelativeLayout>

5）在activity中加载图片显示，Fresco 不支持相对路径的URI. 所有的URI都必须是绝对路径，并且带上该URI的scheme。

package com.example.nanchen.imageloadfrescodemo;

import android.net.Uri;

import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;

import com.facebook.drawee.backends.pipeline.Fresco;

import com.facebook.drawee.interfaces.DraweeController;

import com.facebook.drawee.view.SimpleDraweeView;

public class MainActivity extends AppCompatActivity
 {

    private SimpleDraweeView
 sdv;

    @Override

    protected void onCreate(Bundle
 savedInstanceState) {

        super.onCreate(savedInstanceState);

//       
 Fresco.initialize(this);//Fresco的初始化，必须调用在setContentView之前

        setContentView(R.layout.activity_main);

        sdv
 = (SimpleDraweeView) findViewById(R.id.main_simple_drawee_view);

        Uri
 uri =  Uri.parse("http://dynamic-image.yesky.com/740x-/uploadImages/2015/163/50/690V3VHW0P77.jpg");

//       
 sdv.setImageURI(uri);

        DraweeController
 controller = Fresco.newDraweeControllerBuilder()

                .setUri(uri)

                .setAutoPlayAnimations(true)

                .build();

        sdv.setController(controller);

    }

}

运行效果如下：

drawee支持如下属性：

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"

//图片加载失败时显示，提示用户点击重新加载，重复加载4次还是没有加载出来的时候才会显示failureImage的图片

fresco:retryImageScaleType="centerCrop" //重新加载的图片缩放类型

fresco:progressBarImage="@drawable/progress_bar" //进度条图片

fresco:progressBarImageScaleType="centerInside"

fresco:progressBarAutoRotateInterval="1000"

//进度图自动旋转间隔时间(单位：毫秒ms)

fresco:backgroundImage="@color/blue"

//背景图片，这里的背景图片首先被绘制

fresco:overlayImage="@drawable/watermark"

//
 设置叠加图，在xml中只能设置一张叠加图片，如果需要多张图片的话，需要在java代码中设置哦

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" //边框颜色

上面的ImageScaleType有下面一些缩放类型：

类型	描述
center	居中，无缩放
centerCrop	保持宽高比缩小或放大，是的两边都大于或等于边界，且宽和高契合显示边界，居中显示
focusCrop	同centerCrop，但居中点不是中点，而是指定的某个点
centerInside	缩放图片使两边都在显示边界内，居中显示。和fitCenter不同，不会对图片进行放大。如果尺寸大于显示边界，则保持宽高比例缩小图片。
fitCenter	保持宽高比，缩小或者放大，使得图片完全显示在显示边界内，且宽或高契合显示边界，居中显示。
fitStart	同上，但不居中，和显示边界左上对齐。
fitEnd	同fitCenter，但不居中，和显示边界右下对齐。
fitXY	不保存宽高比，填充满显示边界。
none	如果要使用tile mode显示，则需要设置为none

多图请求

有时候需要加载很多图片，这个时候如果网络情况不是很好的情况下，一直显示占位图，体验也不是很好，我们可以先显示一个低分辨率的图片，等到大图加载完成之后，在显示真正的图片。

DraweeController
 controller = Fresco.newDraweeControllerBuilder()

    .setLowResImageRequest(ImageRequest.fromUri(lowResUri))

    .setImageRequest(ImageRequest.fromUri(highResUri))

    .setOldController(draweeView.getController())

    .build();

draweeView.setController(controller);

当然如果你想监听加载的过程，就加一个ControllerListen

//写一个监听器
 监听图片加载

ControllerListener
 listener = new BaseControllerListener(){

    /**

     *
 当图片加载成功时会执行的方法

     *
 @param id

     *
 @param imageInfo

     *
 @param animatable

     */

    @Override

    public void onFinalImageSet(String
 id, Object imageInfo, Animatable animatable) {

        super.onFinalImageSet(id,
 imageInfo, animatable);

    }

    /**

     *
 图片加载失败时调用的方法

     *
 @param id

     *
 @param throwable

     */

    @Override

    public void onFailure(String
 id, Throwable throwable) {

        super.onFailure(id,
 throwable);

    }

    /**

     * 
 如果图片使用渐进式，这个方法将会被回调

     *
 @param id

     *
 @param throwable

     */

    @Override

    public void onIntermediateImageFailed(String
 id, Throwable throwable) {

        super.onIntermediateImageFailed(id,
 throwable);

    }

};

DraweeController
 controller = Fresco.newDraweeControllerBuilder()

        .setUri(uri)

        .setAutoPlayAnimations(true)

        .setControllerListener(listener)

        .build();

sdv.setController(controller);