图片加载控件Fresco

使用教程：https://www.fresco-cn.org/docs/index.html  https://github.com/facebook/fresco

application初始化fresco
 private void initFresco() {
        Fresco.initialize(this);
    }

@Bind(R.id.sdv_fresco_spimg)
SimpleDraweeView sdvFrescoSpimg;

private void initData() {
        tvTitle.setText("带进度条的图片");

        // 设置样式
        GenericDraweeHierarchyBuilder builder = new GenericDraweeHierarchyBuilder(getResources());

        GenericDraweeHierarchy hierarchy = builder.setProgressBarImage(new ProgressBarDrawable()).build();

        sdvFrescoSpimg.setHierarchy(hierarchy);

        // 加载图片的地址
        Uri uri = Uri.parse("http://img4.duitang.com/uploads/item/201211/24/20121124175330_ruKEK.jpeg");

        // 加载图片
        sdvFrescoSpimg.setImageURI(uri);
    }

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:fresco="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_fresco_spimg"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <include layout="@layout/titlebar"></include>

    <com.facebook.drawee.view.SimpleDraweeView
        android:id="@+id/sdv_fresco_spimg"
        android:layout_width="130dp"
        android:layout_gravity="center"
        android:layout_height="130dp"
        fresco:placeholderImage="@drawable/atguigu_logo" />

</LinearLayout>

图片裁剪

public class FrescoCropActivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.sdv_fresco_crop)
    SimpleDraweeView sdvFrescoCrop;
    @Bind(R.id.tv_fresco_explain)
    TextView tvFrescoExplain;
    private GenericDraweeHierarchyBuilder builder;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_crop);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("图片的不同裁剪");

        builder = new GenericDraweeHierarchyBuilder(getResources());
    }

     private void imageDisplay(GenericDraweeHierarchy hierarchy) {
        sdvFrescoCrop.setHierarchy(hierarchy);

        // 加载图片
        Uri uri = Uri.parse("http://img4q.duitang.com/uploads/item/201305/20/20130520115416_VrUUR.jpeg");
        sdvFrescoCrop.setImageURI(uri);
    }

    // 居中，无缩放
    @OnClick(R.id.bt_fresco_center)
    void bt_fresco_center_click(View view){
        // 设置描述
        tvFrescoExplain.setText("居中，无缩放");

        // 样式设置
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(ScalingUtils.ScaleType.CENTER).build();

        // 图片显示
        imageDisplay(hierarchy);

    }

    // 保持宽高比缩小或放大，使得两边都大于或等于显示边界。居中显示
    @OnClick(R.id.bt_fresco_centercrop)
    void bt_fresco_centercrop_click(View view){
        // 设置描述
        tvFrescoExplain.setText("保持宽高比缩小或放大，使得两边都大于或等于显示边界。居中显示");

        // 样式设置
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(ScalingUtils.ScaleType.CENTER_CROP).build();

        // 图片显示
        imageDisplay(hierarchy);
    }

    // 同centerCrop, 但居中点不是中点，而是指定的某个点,这里我设置为图片的左上角那点
    @OnClick(R.id.bt_fresco_focuscrop)
    void bt_fresco_focuscrop_click(View view){

        // 设置描述
        tvFrescoExplain.setText("同centerCrop, 但居中点不是中点，而是指定的某个点,这里我设置为图片的左上角那点");

        // 样式设置
        PointF point = new PointF(0,0);
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(ScalingUtils.ScaleType.FOCUS_CROP)
                .setActualImageFocusPoint(point).build();

        // 图片显示
        imageDisplay(hierarchy);
    }

    // 使两边都在显示边界内，居中显示。如果图尺寸大于显示边界，则保持长宽比缩小图片
    @OnClick(R.id.bt_fresco_centerinside)
    void bt_fresco_centerinside_click(View view){
        // 设置描述
        tvFrescoExplain.setText("使两边都在显示边界内，居中显示。如果图尺寸大于显示边界，则保持长宽比缩小图片");

        // 样式设置
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(ScalingUtils.ScaleType.CENTER_INSIDE).build();

        // 图片显示
        imageDisplay(hierarchy);
    }

    // 保持宽高比，缩小或者放大，使得图片完全显示在显示边界内。居中显示
    @OnClick(R.id.bt_fresco_fitcenter)
    void bt_fresco_fitcenter_click(View view){
        // 设置描述
        tvFrescoExplain.setText("保持宽高比，缩小或者放大，使得图片完全显示在显示边界内。居中显示");

        // 样式设置
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(ScalingUtils.ScaleType.FIT_CENTER).build();

        // 图片显示
        imageDisplay(hierarchy);
    }

    // 保持宽高比，缩小或者放大，使得图片完全显示在显示边界内，不居中，和显示边界左上对齐
    @OnClick(R.id.bt_fresco_fitstart)
    void bt_fresco_fitstart_click(View view){
        // 设置描述
        tvFrescoExplain.setText("保持宽高比，缩小或者放大，使得图片完全显示在显示边界内，不居中，和显示边界左上对齐");

        // 样式设置
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(ScalingUtils.ScaleType.FIT_START).build();

        // 图片显示
        imageDisplay(hierarchy);
    }

    // 保持宽高比，缩小或者放大，使得图片完全显示在显示边界内，不居中，和显示边界右下对齐
    @OnClick(R.id.bt_fresco_fitend)
    void bt_fresco_fitend_click(View view){
        // 设置描述
        tvFrescoExplain.setText("保持宽高比，缩小或者放大，使得图片完全显示在显示边界内，不居中，和显示边界右下对齐");

        // 样式设置
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(ScalingUtils.ScaleType.FIT_END).build();

        // 图片显示
        imageDisplay(hierarchy);
    }

    // 不保持宽高比，填充满显示边界
    @OnClick(R.id.bt_fresco_fitxy)
    void bt_fresco_fitxy_click(View view){
        // 设置描述
        tvFrescoExplain.setText("不保持宽高比，填充满显示边界");

        // 样式设置
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(ScalingUtils.ScaleType.FIT_XY).build();

        // 图片显示
        imageDisplay(hierarchy);
    }

    // 如要使用title mode显示, 需要设置为none
    @OnClick(R.id.bt_fresco_none)
    void bt_fresco_none_click(View view){
        // 设置描述
        tvFrescoExplain.setText("如要使用title mode显示, 需要设置为none");

        // 样式设置
        GenericDraweeHierarchy hierarchy = builder.setActualImageScaleType(null).build();

        // 图片显示
        imageDisplay(hierarchy);
    }
}

圆形圆角图片

public class FrescoCircleAndCornerActivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.sdv_fresco_circleandcorner)
    SimpleDraweeView sdvFrescoCircleandcorner;
    private Uri uri;
    private GenericDraweeHierarchyBuilder builder;
    private RoundingParams parames;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_circle_and_corner);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("圆形和圆角图片");

        uri = Uri.parse("http://img4q.duitang.com/uploads/item/201304/27/20130427043538_wAfHC.jpeg");

        builder = new GenericDraweeHierarchyBuilder(getResources());
    }

    // 设置圆形图片
    @OnClick(R.id.bt_fresco_circle)
    void bt_fresco_circle_click(View view){

        // 设置圆形图片
        parames = RoundingParams.asCircle();
        GenericDraweeHierarchy hierarchy = builder.setRoundingParams(parames).build();
        sdvFrescoCircleandcorner.setHierarchy(hierarchy);

        sdvFrescoCircleandcorner.setImageURI(uri);
    }

    // 设置圆角图片
    @OnClick(R.id.bt_fresco_corner)
    void bt_fresco_corner_click(View view){

        parames = RoundingParams.fromCornersRadius(50f);
        parames.setOverlayColor(getResources().getColor(android.R.color.holo_red_light));//覆盖层
        parames.setBorder(getResources().getColor(android.R.color.holo_blue_light), 5);//边框

        GenericDraweeHierarchy hierarchy = builder.setRoundingParams(parames).build();
        sdvFrescoCircleandcorner.setHierarchy(hierarchy);

        // 加载图片
        sdvFrescoCircleandcorner.setImageURI(uri);
    }
}

渐近式展示图片

public class FrescoJpegActivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.sdv_fresco_jpeg)
    SimpleDraweeView sdvFrescoJpeg;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_jpeg);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("渐进式展示图片");
    }

    @OnClick(R.id.sdv_fresco_askImg)
    void sdv_fresco_askImg_click(View view){

        // 加载质量配置
        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();

        // 获取图片URL
        Uri uri = Uri.parse("http://cdn.duitang.com/uploads/item/201303/12/20130312021353_45Qix.jpeg");

        // 获取图片请求
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri).setProgressiveRenderingEnabled(true).build();

        DraweeController draweeController = Fresco.newDraweeControllerBuilder()
                .setImageRequest(request)
                .setTapToRetryEnabled(true)
                .setOldController(sdvFrescoJpeg.getController())//使用oldController可以节省不必要的内存分配
                .build();

        // 1设置加载的控制
        sdvFrescoJpeg.setController(draweeController);

    }
}

 请求GIF图片

public class FrescoGifAcitivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.sdv_fresco_gif)
    SimpleDraweeView sdvFrescoGif;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_gif_acitivity);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("Gif动画图片");
    }

    // 请求gif图片
    @OnClick(R.id.bt_fresco_askImg)
    void bt_fresco_askImg_click(View view){

        Uri uri = Uri.parse("http://www.sznews.com/humor/attachement/gif/site3/20140902/4487fcd7fc66156f51db5d.gif");

        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setUri(uri)
                .setAutoPlayAnimations(false)
                .setOldController(sdvFrescoGif.getController())
                .build();

        sdvFrescoGif.setController(controller);
    }

    //  动画停止
    @OnClick(R.id.bt_fresco_stopAnim)
    void bt_fresco_stopAnim_click(View view){
        Animatable animatable = sdvFrescoGif.getController().getAnimatable();

        if(animatable != null && animatable.isRunning()) {
            animatable.stop();
        }

    }

    // 动画开始
    @OnClick(R.id.bt_fresco_startAnim)
    void bt_fresco_startAnim_click(View view){

        Animatable animatable = sdvFrescoGif.getController().getAnimatable();

        if(animatable != null && !animatable.isRunning()) {
            animatable.start();
        }
    }
}

多图请求及图片复用

public class FrescoMultiActivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.sdv_fresco_multi)
    SimpleDraweeView sdvFrescoMulti;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_multi);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("多图请求及图片复用");
    }

    // 先显示低分辨率的图，然后是高分辨率的图
    @OnClick(R.id.bt_fresco_multiImg)
    void bt_fresco_multiImg_click(View view){

        // 图片地址
        Uri lowUri = Uri.parse("http://img1.gamedog.cn/2012/03/11/19-120311133617-50.jpg");
        Uri highUri = Uri.parse("http://img5.duitang.com/uploads/item/201312/03/20131203153823_Y4y8F.jpeg");

        // 控制加载图片
        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setLowResImageRequest(ImageRequest.fromUri(lowUri))
                .setImageRequest(ImageRequest.fromUri(highUri))
                .build();

        // 加载图片
        sdvFrescoMulti.setController(controller);
    }

    // 本地缩略图预览
    @OnClick(R.id.bt_fresco_thumbnailImg)
    void bt_fresco_thumbnailImg_click(View view){

        // 图片地址
        Uri uri = Uri.fromFile(new File(Environment.getExternalStorageDirectory() +"/meinv1.jpg"));
        // 加载图片的请求
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                .setLocalThumbnailPreviewsEnabled(true)
                .build();

        // 控制图片的加载
        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setImageRequest(request)
                .build();

        // 加载图片
        sdvFrescoMulti.setController(controller);
    }

    // 本地图片复用
    @OnClick(R.id.bt_fresco_multiplexImg)
    void bt_fresco_multiplexImg_click(View view){
        //本地图片的复用
        //在请求之前，还会去内存中请求一次图片，没有才会先去本地，最后去网络uri
        //本地准备复用图片的uri  如果本地这个图片不存在，会自动去加载下一个uri

        // 请求加载图片
        Uri uri1 = Uri.fromFile(new File(Environment.getExternalStorageDirectory()+"/meinv.jpg"));
        //图片的网络uri
        Uri uri2 = Uri.parse("http://img5.duitang.com/uploads/item/201312/03/20131203153823_Y4y8F.jpeg");

        ImageRequest request1 = ImageRequest.fromUri(uri1);
        ImageRequest request2 = ImageRequest.fromUri(uri2);
        ImageRequest[] requests = {request1, request2};

        // 控制加载图片
        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setFirstAvailableImageRequests(requests)
                .setOldController(sdvFrescoMulti.getController())
                .build();

        // 加载图片
        sdvFrescoMulti.setController(controller);
    }
}

图片加载监听

public class FrescoListenerActivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.sdv_fresco_listener)
    SimpleDraweeView sdvFrescoListener;
    @Bind(R.id.tv_fresco_listener)
    TextView tvFrescoListener;
    @Bind(R.id.tv_fresco_listener2)
    TextView tvFrescoListener2;
    private ControllerListener controllerListener = new BaseControllerListener<ImageInfo>(){
        // 加载图片完毕
        @Override
        public void onFinalImageSet(String id, ImageInfo imageInfo, Animatable animatable) {
            super.onFinalImageSet(id, imageInfo, animatable);

            if (imageInfo == null) {
                return;
            }

            // 获取图片的质量
            QualityInfo qualityInfo = imageInfo.getQualityInfo();

            tvFrescoListener.setText("Final image received! " +
                    "\nSize: " + imageInfo.getWidth()
                    + "x" + imageInfo.getHeight()
                    + "\nQuality level: " + qualityInfo.getQuality()
                    + "\ngood enough: " + qualityInfo.isOfGoodEnoughQuality()
                    + "\nfull quality: " + qualityInfo.isOfFullQuality());
        }

        // 渐进式加载图片回调
        @Override
        public void onIntermediateImageSet(String id, ImageInfo imageInfo) {
            super.onIntermediateImageSet(id, imageInfo);

            tvFrescoListener2.setText("IntermediateImageSet image receiced");
        }

        // 加载图片失败
        @Override
        public void onFailure(String id, Throwable throwable) {
            super.onFailure(id, throwable);

            tvFrescoListener.setText("Error loading" + id);
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_listener);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("图片加载监听");
    }

    @OnClick(R.id.bt_fresco_listener)
    void bt_fresco_listener(View view){

        // 加载图片质量配置
        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();

        // 图片地址
        Uri uri = Uri.parse("http://h.hiphotos.baidu.com/zhidao/pic/item/58ee3d6d55fbb2fbac4f2af24f4a20a44723dcee.jpg");

        // 图片请求
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                .setProgressiveRenderingEnabled(true)
                .build();

        // 图片加载的控制
        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setOldController(sdvFrescoListener.getController())
                .setImageRequest(request)
                .setControllerListener(controllerListener)
                .build();

        // 加载图片
        sdvFrescoListener.setController(controller);
    }
}

图片尺寸修改和旋转

public class FrescoResizeActivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.sdv_fresco_resize)
    SimpleDraweeView sdvFrescoResize;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_resize);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("图片缩放和旋转");
    }

    // 修内存中改图片大小
    @OnClick(R.id.bt_fresco_resize)
    void bt_fresco_resize_click(View view){

        // 图片地址
        Uri uri = Uri.parse("http://c.hiphotos.baidu.com/image/pic/item/962bd40735fae6cd21a519680db30f2442a70fa1.jpg");

        // 图片的请求
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                .setResizeOptions(new ResizeOptions(50,50))
                .build();

        // 控制图片的加载
        PipelineDraweeController controller = (PipelineDraweeController) Fresco.newDraweeControllerBuilder()
                .setOldController(sdvFrescoResize.getController())
                .setImageRequest(request)
                .build();

        // 加载图片
        sdvFrescoResize.setController(controller);
    }

    // 旋转图片
    @OnClick(R.id.bt_fresco_rotate)
    void bt_fresco_rotate_click(View view){

        Uri uri = Uri.parse("http://c.hiphotos.baidu.com/image/pic/item/962bd40735fae6cd21a519680db30f2442a70fa1.jpg");
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                .setAutoRotateEnabled(true)
                .build();

        // 控制图片的加载
        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setOldController(sdvFrescoResize.getController())
                .setImageRequest(request)
                .build();

        // 加载图片
        sdvFrescoResize.setController(controller);
    }
}

修改图片

public class FrescoModifyActivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.sdv_fresco_modify)
    SimpleDraweeView sdvFrescoModify;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_modify);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("修改图片");
    }

    @OnClick(R.id.bt_fresco_modify)
    void bt_fresco_modify_click(View view){

        // 图片地址
        Uri uri = Uri.parse("http://c.hiphotos.baidu.com/image/pic/item/962bd40735fae6cd21a519680db30f2442a70fa1.jpg");

        // 修改图片
        Postprocessor postProcessor = new BasePostprocessor() {
            @Override
            public String getName() {
                return "postProcessor";
            }

            @Override
            public void process(Bitmap bitmap) {

                for (int x = 0; x < bitmap.getWidth(); x += 2) {

                    for (int y = 0; y < bitmap.getHeight(); y += 2) {
                        bitmap.setPixel(x, y, Color.RED);
                    }
                }
            }
        };

        // 创建图片请求
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                .setPostprocessor(postProcessor)
                .build();

        // 控制加载
        PipelineDraweeController controller = (PipelineDraweeController)Fresco.newDraweeControllerBuilder()
                .setOldController(sdvFrescoModify.getController())
                .setImageRequest(request)
                .build();

        // 加载图片
        sdvFrescoModify.setController(controller);
    }
}

动态展示图片

public class FrescoAutoSizeActivity extends Activity {

    @Bind(R.id.tv_title)
    TextView tvTitle;
    @Bind(R.id.ll_fresco)
    LinearLayout llFresco;
    private SimpleDraweeView simpleDraweeView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_fresco_auto_size);
        ButterKnife.bind(this);

        initData();
    }

    private void initData() {
        tvTitle.setText("动态展示图片");

        simpleDraweeView = new SimpleDraweeView(this);
        // 设置宽高比
        simpleDraweeView.setAspectRatio(3.0f);
    }

    @OnClick(R.id.bt_fresco_loadsmall)
    void bt_fresco_loadsmall_click(View view){

        // 图片的地址
        Uri uri = Uri.parse("http://img4q.duitang.com/uploads/item/201304/27/20130427043538_wAfHC.jpeg");
        // 图片的请求
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                .build();

        // 加载图片的控制
        PipelineDraweeController controller = (PipelineDraweeController) Fresco.newDraweeControllerBuilder()
                .setOldController(simpleDraweeView.getController())
                .setImageRequest(request)
                .build();

        // 加载图片
        simpleDraweeView.setController(controller);

        // 添加View到线性布局中
        llFresco.addView(simpleDraweeView);
    }
}