Fresco的使用及简单的几种用法

 //Fresco,无论使用哪个模块的功能,都必须要添加的基础依赖
  compile 'com.facebook.fresco:fresco:0.14.1'

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

  compile 'com.facebook.fresco:webpsupport:0.14.1'

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

  compile 'com.facebook.fresco:animated-gif:0.14.1'

// 支持 WebP静态图及 WebP 动图，需要添加

  compile 'com.facebook.fresco:animated-webp:0.14.1'

  compile 'com.facebook.fresco:webpsupport:0.14.1'

// 在 API < 14 上的机器支持 WebP 时，需要添加

  compile 'com.facebook.fresco:animated-base-support:0.14.1'

在application中初始化Fresco(记得在清单文件里配置application)

   Fresco.initialize(this);

配置网络权限 

   

在xml布局文件中,加入命名空间

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

在xml中引入SimpleDraweeView控件(fresco:placeholderImage="@drawable/my_drawable":默认占位图片)

    android:id="@+id/my_image_view"

    android:layout_width="130dp"

    android:layout_height="130dp"

    fresco:placeholderImage="@drawable/my_drawable"

  />

//加载网络图片的网址

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);

带进度条的图片

//所要加载图片的网址
Uri uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");
//创建Builder对象,一般创建出参数对象
GenericDraweeHierarchyBuilder builder = new GenericDraweeHierarchyBuilder(getResources());
//创建参数对象,设置其样式为进度条
GenericDraweeHierarchy hierarchy = builder.setProgressBarImage(new ProgressBarDrawable()).build();
//将参数对象设置给图片控件
myImageView.setHierarchy(hierarchy);
//控件加载图片,参数:网络图片的网址.
myImageView.setImageURI(uri);

图片的不同裁剪

//主线程中

builder = new GenericDraweeHierarchyBuilder(getResources());

//点击事件

case R.id.btn1:
            // 设置描述
            tvFrescoExplain.setText("居中，无缩放");
            // 样式设置,使图片只显示中间的部分
            GenericDraweeHierarchy CENTER = builder.setActualImageScaleType(ScalingUtils.ScaleType.CENTER).build();
            // 显示图片
            imageDisplay(CENTER);
            break;

        case R.id.btn2:
            // 设置描述
            tvFrescoExplain.setText("保持宽高比缩小或放大，使得两边都大于或等于显示边界。居中显示");
            // 样式设置,使图片按比例缩小或放大,且裁剪成正方形.
            GenericDraweeHierarchy CENTER_CROP =builder.setActualImageScaleType(ScalingUtils.ScaleType.CENTER_CROP).build();
            // 图片显示
            imageDisplay(CENTER_CROP);
            break;

        case R.id.btn3:
            // 设置描述
            tvFrescoExplain.setText("同centerCrop, 但居中点不是中点，而是指定的某个点,这里我设置为图片的左上角那点");
            //指定中心点位置
            PointF point = new PointF(0,0);
            //根据指定的点设置为图片中心,使图片按比例缩小或放大,且裁剪成正方形.
            GenericDraweeHierarchy FOCUS_CROP = builder.setActualImageScaleType(ScalingUtils.ScaleType.FOCUS_CROP)
                    .setActualImageFocusPoint(point).build();
            // 图片显示
            imageDisplay(FOCUS_CROP);
            break;

        case R.id.btn4:
            // 设置描述
            tvFrescoExplain.setText("使两边都在显示边界内，居中显示。如果图尺寸大于显示边界，则保持长宽比缩小图片");
            // 样式设置,使图片按比例显示在控件内,
            GenericDraweeHierarchy CENTER_INSIDE =builder.setActualImageScaleType(ScalingUtils.ScaleType.CENTER_INSIDE).build();
            // 图片显示
            imageDisplay(CENTER_INSIDE);
            break;

        case R.id.btn5:
            // 设置描述
            tvFrescoExplain.setText("保持宽高比，缩小或者放大，使得图片完全显示在显示边界内。居中显示");
            // 样式设置,保持宽高比例,对图片进行缩或放,图片位置居中显示(效果和上面一种类似)
            GenericDraweeHierarchy FIT_CENTER =builder.setActualImageScaleType(ScalingUtils.ScaleType.FIT_CENTER).build();
            // 图片显示
            imageDisplay(FIT_CENTER);
            break;

        case R.id.btn6:
            // 设置描述
            tvFrescoExplain.setText("保持宽高比，缩小或者放大，使得图片完全显示在显示边界内，不居中，和显示边界左上对齐");
            // 样式设置,保持宽高比例,对图片进行缩或放,图片位置,不居中，和显示边界左上对齐
            GenericDraweeHierarchy FIT_START =builder.setActualImageScaleType(ScalingUtils.ScaleType.FIT_START).build();
            // 图片显示
            imageDisplay(FIT_START);
            break;

        case R.id.btn7:
            // 设置描述
            tvFrescoExplain.setText("保持宽高比，缩小或者放大，使得图片完全显示在显示边界内，不居中，和显示边界右下对齐");
            // 样式设置,保持宽高比例,对图片进行缩或放,图片位置,不居中，和显示边界右下对齐
            GenericDraweeHierarchy FIT_END =builder.setActualImageScaleType(ScalingUtils.ScaleType.FIT_END).build();
            // 图片显示
            imageDisplay(FIT_END);
            break;

        case R.id.btn8:
            // 设置描述
            tvFrescoExplain.setText("不保持宽高比，填充满显示边界");
            // 样式设置,使图片填充整个控件,不保证宽高比例.
            GenericDraweeHierarchy FIT_XY = builder.setActualImageScaleType(ScalingUtils.ScaleType.FIT_XY).build();
            // 图片显示
            imageDisplay(FIT_XY);
            break;

        case R.id.btn9:
            // 设置描述
            tvFrescoExplain.setText("如要使用title mode显示, 需要设置为none");
            // 样式设置
            GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(null).build();
            // 图片显示
            imageDisplay(hierarchy);
            break;
    }
}
private void imageDisplay(GenericDraweeHierarchy hierarchy) {
    // 加载图片
    Uri uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");
    myImageView.setHierarchy(hierarchy);
    myImageView.setImageURI(uri);
}

圆形和圆角图片

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_circle_and_corner);
    ButterKnife.bind(this);
    builder = new GenericDraweeHierarchyBuilder(getResources());
    uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");
}

@OnClick({R.id.btn1, R.id.btn2})
public void onViewClicked(View view) {
    switch (view.getId()) {
        case R.id.btn1:
            params = RoundingParams.asCircle();
            //创建设置参数,设置一个形状,把形状对象塞入
            GenericDraweeHierarchy roundness = builder.setRoundingParams(params).build();
            //将参数对象设置给图片控件
            myImageView.setHierarchy(roundness);
            //控件加载图片
            myImageView.setImageURI(uri);
            break;

        case R.id.btn2:
            roundingParams = RoundingParams.fromCornersRadius(50f);
            GenericDraweeHierarchy circularBead = builder.setRoundingParams(roundingParams).build();
            myImageView.setHierarchy(circularBead);
            // 加载图片
            myImageView.setImageURI(uri);
            break;
    }
}

渐进式展示图片

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_jpeg);
    ButterKnife.bind(this);
    uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");
}
// 加载质量配置,为了实现节省CPU,随着图片下载的进行，下载完的扫描序列如下: 1, 4, 5, 10
    /* 首次调用getNextScanNumberToDecode返回为2， 因为初始时，解码的扫描数为0。
    那么1将不会解码，下载完成4个扫描时，解码一次。下个解码为扫描数为6(5不会解码，10才会解码)*/
@OnClick(R.id.btn)
public void onViewClicked() {
    ProgressiveJpegConfig jpegConfig = new ProgressiveJpegConfig() {
        @Override
        public int getNextScanNumberToDecode(int scanNumber) {
            return scanNumber + 2;
        }
        @Override
        public QualityInfo getQualityInfo(int scanNumber) {
            boolean isGoodEnough = (scanNumber >= 5);
            return ImmutableQualityInfo.of(scanNumber, isGoodEnough, false);
        }
    };
    //上面的和下面一行是固定代码.使用使复制粘贴即可
    ImagePipelineConfig.newBuilder(this).setProgressiveJpegConfig(jpegConfig).build();
    // 创建 ImageRequest 对象.
    ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)//设置URL
            .setProgressiveRenderingEnabled(true)//打开渐进 渲染
            .build();
    DraweeController draweeController = Fresco.newDraweeControllerBuilder()
            //必须要设置ImageRequest对象,里面包含了图片的网址.
            .setImageRequest(request)
            //开启用户点击重新加载图片的功能
            .setTapToRetryEnabled(true)
            //会复用以前的对象,可以节省内存.
            .setOldController(myImageView.getController())
            .build();
    // 1设置加载的控制
    myImageView.setController(draweeController);
}

GIF动画图片

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_gif);
    ButterKnife.bind(this);
    uri = Uri.parse("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1514215468722&di=0bfc021987ca0c9a843923bc2707714b&imgtype=0&src=http%3A%2F%2Fimg2.ph.126.net%2F8F_xhNZSxkEkEqmIsiAATg%3D%3D%2F1834090948346827460.gif");
}

@OnClick({R.id.btn, R.id.btn1, R.id.btn2})
public void onViewClicked(View view) {
    switch (view.getId()) {
        case R.id.btn:
            DraweeController controller = Fresco.newDraweeControllerBuilder()
                    .setUri(uri)//设置GIF网址
                    .setAutoPlayAnimations(false)//是否自动播放动画,false为不播放
                    .setOldController(myImageView.getController())//内存优化
                    .build();
            myImageView.setController(controller);
            break;
        case R.id.btn1:
            Animatable animatableStart = myImageView.getController().getAnimatable();
            //进行非空及是否动画在播放判断
            if(animatableStart != null && !animatableStart.isRunning()) {
            //动画停止播放,播放动画
                animatableStart.start();
            }
            break;
        case R.id.btn2:
            Animatable animatableStop = myImageView.getController().getAnimatable();
            //进行非空及是否动画在播放判断
            if(animatableStop != null && animatableStop.isRunning()) {
            //动画在播放,停止动画播放
                animatableStop.stop();
            }
            break;
    }
}

多图请求及图片复用

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_multi);
    ButterKnife.bind(this);
    lowUri = Uri.parse("http://img1.gamedog.cn/2012/03/11/19-120311133617-50.jpg");
    highUri = Uri.parse("http://img5.duitang.com/uploads/item/201312/03/20131203153823_Y4y8F.jpeg");

}

@OnClick({R.id.btn, R.id.btn1, R.id.btn2})
public void onViewClicked(View view) {
    switch (view.getId()) {
        case R.id.btn:
            // 控制加载图片
            DraweeController controller = Fresco.newDraweeControllerBuilder()
            //一开始加载一个低分辨率的URL
                    .setLowResImageRequest(ImageRequest.fromUri(lowUri))
            //然后加载一个高分辨率的URL,你真正要加载的图片
                    .setImageRequest(ImageRequest.fromUri(highUri))
                    .build();
            // 加载图片
            myImageView.setController(controller);
            break;

        case R.id.btn1:
            Uri uri = Uri.fromFile(new File(Environment.getExternalStorageDirectory() +"/shuaige.jpg"));
            // 加载图片的请求
            ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
            //开启缩略图预览模式
                    .setLocalThumbnailPreviewsEnabled(true)
                    .build();
            // 控制图片的加载
            DraweeController preview = Fresco.newDraweeControllerBuilder()
                    .setImageRequest(request)
                    .build();
            // 加载图片
            myImageView.setController(preview);
            break;
        case R.id.btn2:
            Uri uri1 = Uri.fromFile(new File(Environment.getExternalStorageDirectory()+"/shuaige.jpg"));
            //图片的网址
            Uri uri2 = Uri.parse("http://img5.duitang.com/uploads/item/201312/03/20131203153823_Y4y8F.jpeg");
            //创建ImageRequest对象,将其放入ImageRequest[]数组中.
            ImageRequest request1 = ImageRequest.fromUri(uri1);
            ImageRequest request2 = ImageRequest.fromUri(uri2);
            ImageRequest[] requests = {request1, request2};
            // 控制加载图片
            DraweeController reuse = Fresco.newDraweeControllerBuilder()
            //设置加载图片的顺序.参数ImageRequest[]数组
                    .setFirstAvailableImageRequests(requests)
                    .setOldController(myImageView.getController())
                    .build();
            // 加载图片
            myImageView.setController(reuse);

            break;
    }
}

图片加载监听

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_listener_avtivity);
    ButterKnife.bind(this);
    // Uri uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");

}

@OnClick(R.id.btn)
public void onViewClicked() {
    Uri uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");
    ControllerListener controllerListener = new BaseControllerListener<ImageInfo>() {
        @Override
        public void onFinalImageSet(
                String id,
                @Nullable ImageInfo imageInfo,
                @Nullable Animatable anim) {
            if (imageInfo == null) {
                return;
            }
            QualityInfo qualityInfo = imageInfo.getQualityInfo();
            t1.setText("宽:"+imageInfo.getWidth());
            t2.setText("高:"+imageInfo.getHeight()+"");
            t3.setText("图片等级:"+qualityInfo.getQuality()+"");
            t4.setText("图片效果是否完全显示:"+qualityInfo.isOfGoodEnoughQuality()+"");
            boolean ofFullQuality = qualityInfo.isOfFullQuality();
            t5.setText("图片是否完全显示" + ofFullQuality );
        }

        @Override
        public void onIntermediateImageSet(String id, @Nullable ImageInfo imageInfo) {
            //FLog.d("Intermediate image received");
        }

        @Override
        public void onFailure(String id, Throwable throwable) {
            FLog.e(getClass(), throwable, "Error loading %s", id);
        }
    };


    DraweeController controller = Fresco.newDraweeControllerBuilder()
            .setControllerListener(controllerListener)
            .setUri(uri)
            .build();
    myImageView.setController(controller);
}

图片旋转

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_modify_img);
    ButterKnife.bind(this);
    uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");
    myImageView.setImageURI(uri);
}

@OnClick(R.id.btn)
public void onViewClicked() {
    rotate(myImageView,RotationOptions.ROTATE_90);
}
private void rotate(SimpleDraweeView img, int rotate) {
    RotationOptions rotationOptions = RotationOptions.forceRotation(rotate);
    ImageRequest build = ImageRequestBuilder.newBuilderWithSource(uri)
            .setRotationOptions(rotationOptions)
            .build();
    PipelineDraweeController controller = (PipelineDraweeController) Fresco.newDraweeControllerBuilder()
            .setImageRequest(build)
            .build();
    myImageView.setController(controller);
}

修改图片

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_resize);
        ButterKnife.bind(this);
        uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");
    }


    @OnClick(R.id.btn)
    public void onViewClicked() {
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
//重新设置这张图片的宽高.以便解决内存
                .setResizeOptions(new ResizeOptions(50, 50))
                .build();
// 控制图片的加载
        PipelineDraweeController controller = (PipelineDraweeController) Fresco.newDraweeControllerBuilder()
                .setOldController(myImageView.getController())
                .setImageRequest(request)
                .build();
// 加载图片
        myImageView.setController(controller);

    }

动态展示图片

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_auto_size_img);
        ButterKnife.bind(this);
        uri = Uri.parse("https://img-my.csdn.net/uploads/201407/26/1406383264_8243.jpg");
    }

    @OnClick(R.id.btn)
    public void onViewClicked() {
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                .build();
// 加载图片的控制
        PipelineDraweeController controller = (PipelineDraweeController) Fresco.newDraweeControllerBuilder()
                .setOldController(myImageView.getController())
                .setImageRequest(request)
                .build();
// 加载图片
        myImageView.setController(controller);
// 将simpleDraweeView控件对象,添加到线性布局中
       // ll_fresco.addView(simpleDraweeView);

    }