Fresco的使用

• 主页: https://github.com/facebook/fresco
• 中文文档: http://fresco-cn.org/docs/index.html

• 使用步骤

  1. 添加依赖: compile ‘com.facebook.fresco:fresco:0.9.0+’

  2. 添加权限

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

  3. 在Application初始化或在Activity 的setContentView()方法之前，进行初始化

     Fresco.initialize(this);
     

  4. 在布局文件中添加图片控件.宽高必须显示指定,否则图片无法显示.

     <com.facebook.drawee.view.SimpleDraweeView
         android:id="@+id/my_image_view"
         android:layout_width="200dp"
         android:layout_height="200dp"
         fresco:placeholderImage="@mipmap/ic_launcher" />
     

  5. 在Java代码中指定图片的路径.显示图片.SimpleDraweeView接收的路径参数为URI,所以需要一次转换.

     Uri uri = Uri.parse(URL_IMG2);
     SimpleDraweeView view = (SimpleDraweeView) findViewById(R.id.my_image_view);
     view.setImageURI(uri);
     

  6. XML方式配置参数.除图片地址以外,其他所有显示选项都可以在布局文件中指定

     <com.facebook.drawee.view.SimpleDraweeView
         android:id="@+id/my_image_view"
         android:layout_width="20dp"
         android:layout_height="20dp"
         fresco:actualImageScaleType="focusCrop"// 图片的缩放方式.
         fresco:backgroundImage="@color/blue" //背景图.不支持缩放.XML仅能指定一张背景图.如果使用Java代码指定的话,可以指定多个背景,显示方式类似FrameLayout,多个背景图按照顺序一级一级层叠上去.
         fresco:fadeDuration="300" // 渐显图片的时间
         fresco:failureImage="@drawable/error" // 图片加载失败显示的图片
         fresco:failureImageScaleType="centerInside"  图片加载失败显示的图片的缩放类型
         fresco:overlayImage="@drawable/watermark" // 层叠图,最后叠加在图片之上.不支持缩放.XML仅能指定一张.如果使用Java代码指定的话,可以指定多个,显示方式类似FrameLayout,多个图按照顺序一级一级层叠上去.
         fresco:placeholderImage="@color/wait_color"  // 图片加载成功之前显示的占位图
         fresco:placeholderImageScaleType="fitCenter" // 图片加载成功之前显示的占位图的缩放类型
         fresco:pressedStateOverlayImage="@color/red" // 设置按压状态下的层叠图.不支持缩放.
         fresco:progressBarAutoRotateInterval="1000" // 进度条图片旋转显示时长
         fresco:progressBarImage="@drawable/progress_bar" // 进度条图片
         fresco:progressBarImageScaleType="centerInside" //进度条图片的缩放类型
         fresco:retryImage="@drawable/retrying" // 当图片加载失败的时候,显示该图片提示用户点击重新加载图片
         fresco:retryImageScaleType="centerCrop" // 提示图片的缩放类型
         fresco:roundAsCircle="false" // 显示圆形图片
         fresco:roundBottomLeft="false" // roundedCornerRadius属性设置后,四个角都会有圆角,如果左下角不需要设置为false.
         fresco:roundBottomRight="true" // roundedCornerRadius属性设置后,四个角都会有圆角,如果右下角不需要设置为false.
         fresco:roundTopLeft="true" // roundedCornerRadius属性设置后,四个角都会有圆角,如果左上角不需要设置为false.
         fresco:roundTopRight="false" // roundedCornerRadius属性设置后,四个角都会有圆角,如果右上角不需要设置为false.
         fresco:roundWithOverlayColor="@color/corner_color" // 设置图片圆角后空出区域的颜色.如示例图中的红色部分
         fresco:roundedCornerRadius="1dp" // 设置图片圆角角度,设置该属性后四个角都会生效
         fresco:roundingBorderColor="@color/border_color" // 设置圆角后,边框的颜色.
         fresco:roundingBorderWidth="2dp" /> // 设置圆角后,外边框的宽高
     

  7. Java代码配置参数.

         GenericDraweeHierarchy hierarchy = GenericDraweeHierarchyBuilder
                 .newInstance(getResources())
                 .setRetryImage(getResources().getDrawable(R.mipmap.ic_launcher))
                 .build();
     
         imageivew.setHierarchy(hierarchy);
     

  8. 特殊用法:

     1. 显示渐进式JPEG图片

        ProgressiveJpegConfig pjpegConfig = new ProgressiveJpegConfig() {
            @Override
            // 返回下一个需要解码的扫描次数
            public int getNextScanNumberToDecode(int scanNumber) {
                return scanNumber + 2;
            }
        
            // 确定多少个扫描次数之后的图片才能开始显示
            public QualityInfo getQualityInfo(int scanNumber) {
                boolean isGoodEnough = (scanNumber >= 5);
                return ImmutableQualityInfo.of(scanNumber, isGoodEnough, false);
            }
        };
        // ImagePipelineConfig配置如何加载图像
        ImagePipelineConfig config = ImagePipelineConfig.newBuilder(this)
                .setProgressiveJpegConfig(pjpegConfig)
                .build();
        
        img_uri = Uri.parse(URL_IMG2);
        //  显式地指定允许渐进式JPEG图片加载
        ImageRequest request = ImageRequestBuilder
                .newBuilderWithSource(img_uri)
                .setProgressiveRenderingEnabled(true)
                .build();
        // 构建显示图片所用到的DraweeController
        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setImageRequest(request)
                .setOldController(simpleDraweeView.getController())
                .build();
        
        simpleDraweeView.setController(controller);
        

     2. 显示GIF图片.Fresco 支持 GIF 和 WebP 格式的动画图片.如果你希望图片下载完之后自动播放，同时，当View从屏幕移除时，停止播放，只需要在 image request 中简单设置，示例代码:

        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setUri(URL_GIF)
                .setAutoPlayAnimations(true)
                .build();
        simpleDraweeView.setController(controller);