Fresco的入门篇

fresco是facebook推出的一款强大的android图片处理库。它支持圆圈/圆角，缩放，渐进式JPEG图，gif图，图片的缩放旋转等，功能非常强大。下面我带大家一起进入到 Fresco的世界。fresco官网地址

引入Fresco

1. Android Studio 或者 Gradle

检查最外层.gradle 文件中是否包含Maven中央库

allprojects {
    repositories {
        jcenter()
        mavenCentral()   //注意如果没有，请加上
    }
}

在app的.gradle文件中添加

dependencies { compile 'com.facebook.fresco:fresco:0.9.0+' }

最后 Rebuild Project 就导入成功了。

2. Eclipse ADT

使用eclipse就相对比较麻烦一些，首先到 [github地址]上下载文件。
(https://github.com/facebook/fresco)

1. 从菜单 “文件(File)”，选择导入(Import)
2. 展开 Android, 选择 “Existing Android Code into Workspace”， 下一步。
3. 浏览，选中刚才解压的的文件中的 frescolib 目录。
4. 这5个项目应该都会被添加到工程： drawee， fbcore， fresco， imagepipeline， imagepipeline-okhttp。请确认前4个项目一定是被选中的。点击完成。
5. 右键，项目，选择属性，然后选择 Android。
6. 点击右下角的 Add 按钮，选择 fresco，点击 OK，再点击 OK。

支持的URIs

类型	Scheme	示例
远程图片	http://, https://	HttpURLConnection
本地文件	file://	FileInputStream
Content provider	content://	ContentResolver
asset目录下的资源	asset://	AssetManager
res目录下的资源	res://	Resources.openRawResource

res 示例:Uri uri = Uri.parse(“res://包名(实际可以是任何字符串甚至留空)/” + R.drawable.ic_launcher);

加载网络图片

1. AndroidManifest.xml 配置

为了下载网络图片，请确保在 AndroidManifest.xml 中有以下权限：

<uses-permission android:name="android.permission.INTERNET" />

2. 初始化

在Application中：

    @Override
    public void onCreate() {
        super.onCreate();
        Fresco.initialize(sInstance);  //Fresco的初始化
    }

或者在Activity中，调用 setContentView() 之前，进行初始化：

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        Fresco.initialize(sInstance);  //Fresco的初始化
        setContentView(R.layout.activity_initialize);
    }

3. 布局xml文件

<com.facebook.drawee.view.SimpleDraweeView
    xmlns:fresco="http://schemas.android.com/apk/res-auto"
    android:id="@+id/my_image_view"
    android:layout_width="20dp"
    android:layout_height="20dp"
    fresco:placeholderImage="@drawable/my_drawable"
  />

placeholderImage属性表示的是占位符。需要注意layout_width，layout_height不支持wrap_content 如果要设置宽高比, 需要在Java代码中指定setAspectRatio(1.33f)。

4. 代码中使用

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

剩下的，Fresco会替你完成：

1. 显示占位图直到加载完成；
2. 下载图片；
3. 缓存图片；
4. 图片不再显示时，从内存中移除；

圆角/圆圈

xml中配置

   fresco:roundedCornerRadius="5dp"
   fresco:roundBottomLeft="false"
   fresco:roundBottomRight="false"
   fresco:roundWithOverlayColor="@color/blue"
   fresco:roundingBorderWidth="1dp"
   fresco:roundingBorderColor="@color/red"

roundedCornerRadius：圆角的半径
roundBottomLeft：不设置圆角，以直角显示
roundWithOverlayColor：覆盖物颜色
roundingBorderWidth：边角半径
roundingBorderColor：边角颜色
roundAsCircle：true设置为圆圈，false不为圆圈

看下效果图：

代码中

RoundingParams roundingParams = 
    mSimpleDraweeView.getHierarchy().getRoundingParams();
roundingParams.setBorder(R.color.red, 1.0);
roundingParams.setRoundAsCircle(true);
mSimpleDraweeView.getHierarchy().setRoundingParams(roundingParams);

修改图片

ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri) 
    .setResizeOptions(new ResizeOptions(width, height))//width修改的宽度 height修改的高度
     .setAutoRotateEnabled(true) //设置是否旋转
       .setPostprocessor(redMeshPostprocessor)//设置网格
         .build(); 
PipelineDraweeController controller = Fresco.newDraweeControllerBuilder()
    .setOldController(mSimpleDraweeView.getController())
    .setImageRequest(request)
    .build();
mSimpleDraweeView.setController(controller);

在XML中使用Drawees

<com.facebook.drawee.view.SimpleDraweeView
    android:id="@+id/my_image_view"
    android:layout_width="20dp"   // 不支持wrap_content 如果要设置 宽高比, 需要在Java代码中指定setAspectRatio(1.33f);
    android:layout_height="20dp"    // 不支持wrap_content 
    fresco:fadeDuration="300"
    fresco:actualImageScaleType="focusCrop"
    // 设置图片缩放. 通常使用focusCrop,该属性值会通过算法把人头像放在中间
    fresco:placeholderImage="@color/wait_color"
    // 下载成功之前显示的图片
    fresco:placeholderImageScaleType="fitCenter"
    fresco:failureImage="@drawable/error"
    // 加载失败的时候显示的图片
    fresco:failureImageScaleType="centerInside"
    fresco:retryImage="@drawable/retrying"
    // 加载失败,提示用户点击重新加载的图片(会覆盖failureImage的图片)
    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"
    // 圆角角度,180的时候会变成圆形图片
    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"
  />