Fresceo使用详解--用Java代码实现xml配置的效果

GenericDraweeHierarchy

• 百学须先立志—学前须知：

  之前我们学会了如何在XML中设置各项特效的属性，可是在日常开发中，我们的需求是变化莫测的，不可能是提前在XML声明好，也不是所有的控件都写在XML里面；于是用Java代码控制各项特效属性就显得格外重要，掌握这一重要技能势在必得！

• 尽信书，不如无书—能学到什么？

  1、DraweeHierarchy
  2、SettableDraweeHierarchy
  3、GenericDraweeHierarchy
  4、GenericDraweeHierarchyBuilder
  5、getDrawable过时的替代方法：ContextCompat.getDrawable(Context context, int id)

• 工欲善其事必先利其器—了解Fresco

  Fresco中文说明：http://www.fresco-cn.org/

  Fresco项目GitHub地址：https://github.com/facebook/fresco

  上一篇Fresco基础：Fresco-加载图片基础[详细图解Fresco的使用]

• 简单基础：

  首先我们创建一个 activity_main.xml ：

  <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context=".MainActivity">    <com.facebook.drawee.view.SimpleDraweeView        android:id="@+id/main_sdv"        android:layout_width="100dp"        android:layout_height="100dp"        android:layout_centerInParent="true" /></RelativeLayout>
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  

  代码分析：

  

  布局比较简单，必须设置其大小，否则图片将无法正常加载，之前我们也说过，这里呢就不再赘述；接下来书写我们的 MainActivity ：

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView)findViewById(R.id.main_sdv);        //开始下载        sdv.setImageURI(imageUrl);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  

  代码分析：

  

  MainActivity 里面的代码同样比较简单；是不是就可以运行了呢？在此之前我们有一件重要的事情没做，那就是添加 访问网络权限 (我们演示的是从网络上下载图片并用Fresco显示)：

  <!-- 访问网络的权限 --><uses-permission android:name="android.permission.INTERNET"/>
  1
  2
  

  

  运行一下，看下效果：

  

• 获取GenericDraweeHierarchy：

  修改我们刚刚书写的 MainActivity 代码：

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView)findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources()).build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  

  代码分析：

  

  通过 new GenericDraweeHierarchyBuilder(getResources()).build() 获取到 GenericDraweeHierarchy 这个对象。

  注意：

  对于同一个View，请不要多次调用setHierarchy，即使这个View是可回收的。创建 DraweeHierarchy 的较为耗时的一个过程，应该多次利用。—Fresco中文说明

• getDrawable过时的替代方法—ContextCompat.getDrawable(Context context, int id)：

  以前我们加载一张资源图片常用的方式：

  

  在此之前呢，说明一下 上图中画红色波浪线 方法是在 Android5.0 及以后可以正常使用的，我们这里 低版本调用了高版本API里面的方法 所以才会出现此警告。新的可取解决方案：

  //获取资源图片Drawable drawable = ContextCompat.getDrawable(this, R.mipmap.ic_launcher);
  1
  2
  

  

  此时可以看到，没有任何错误或警告。上面三种获取方式中除了过时的以外，其余的两个在 Android5.0 版本及以后使用是不会出现警告的，如：

  

  好了，说完了获取资源图片的几种方式，言归正传继续我们的Fresco之旅。

• 占位图—setPlaceholderImage：

  在此之前我们需要一张占位图 icon_placeholder.png 大家右键另存为即可：

  

  设置占位图它有两个方法，分别是：

  限定符和类型 方法 说明 GenericDraweeHierarchyBuilder setProgressBarImage(Drawable progressBarImage,ScalingUtils.ScaleType progressBarImageScaleType) 设置占位图以及其缩放类型 GenericDraweeHierarchyBuilder setProgressBarImage(Drawable progressBarImage) 设置占位图，它默认的缩放类型是CENTER_INSIDE

  设置占位图方式一，修改我们刚刚书写的 MainActivity 里的内容：

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    //需要下载的图片地址    private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置占位图，它默认的缩放类型是CENTER_INSIDE                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder))                //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  

  代码分析：

  

  设置占位图方式二：

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    //需要下载的图片地址    private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置占位图及它的缩放方式                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  

  代码分析：

  

  两种设置占位图方式大家择其一，运行一下，看看效果：

  

  注意：

  可能大家会想到，我可不可以同时使用两个方法？答案是可以的，但是大家，你先使用的方法会被你后面使用的方法被覆盖，什么意思呢，例如你先使用了 setPlaceholderImage(Drawable placeholderDrawable) 方法，后面紧接着使用了 setPlaceholderImage(Drawable placeholderDrawable, ScalingUtils.ScaleType placeholderImageScaleType) 方法，那么此时，后面这个方法会覆盖前面这个方法，最终运行效果出现的占位图是后面那个方法提供的：

  

• 正在加载图—setProgressBarImage：

  在此之前我们需要一张正在加载图 icon_progress_bar.png 大家右键另存为即可：

  

  设置正在加载图它有两个方法，分别是：

  限定符和类型 方法 说明 GenericDraweeHierarchyBuilder setProgressBarImage(Drawable progressBarImage,ScalingUtils.ScaleType progressBarImageScaleType) 设置正在加载图以及其缩放类型 GenericDraweeHierarchyBuilder setProgressBarImage(Drawable progressBarImage) 设置正在加载图，它默认的缩放类型是CENTER_INSIDE

  设置正在加载图方式一，修改我们刚刚书写的 MainActivity 里的内容：

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    //需要下载的图片地址    private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置占位图及它的缩放方式                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                //设置正在加载图，它默认的缩放类型是CENTER_INSIDE                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar))                //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  

  代码分析：

  

  设置进度图方式二：

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    //需要下载的图片地址    //private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    private Uri imageUrl = Uri.parse("http://www.sonystyle.com.cn/activity/wallpaper/2015/03/10_640x1136_w.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置占位图及它的缩放方式                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  

  分析代码：

  

  还记得我们基础篇中给进度图设置 fresco:progressBarAutoRotateInterval="5000" 这个属性，它就会自动旋转，直到实际图被加载出来。两种设置正在加载图方式大家择其一，运行一下，看看效果：

  

  可以看到，进度图并没有自动旋转，那么官方有没有给出设置自动旋转的方法呢？经过查阅 Fresco官方API 发现并没有提供此类方法。可能大家会想，如果我们在XML中设置自动旋转的属性是不是那么我们就只能通过在XML文件中设置其属性了，修改我们的 activity_main.xml：

  <?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=".MainActivity">    <com.facebook.drawee.view.SimpleDraweeView        android:id="@+id/main_sdv"        android:layout_width="100dp"        android:layout_height="100dp"        fresco:progressBarAutoRotateInterval="5000"        android:layout_centerInParent="true" /></RelativeLayout>
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  

  代码分析：

  

  MainActivity 里面代码无需修改；运行一下，看看效果：

  

  从运行效果来看，就算我们设置了自动旋转属性，那么进度图也不可能旋转；只有进度图和自动旋转属性都在XML中声明出来，才可以让进度图旋转。

• 失败图—setFailureImage：

  在此之前我们需要一张失败图 icon_failure.png 大家右键另存为即可：

  

  设置失败图它有两个方法，分别是：

  限定符和类型 方法 说明 GenericDraweeHierarchyBuilder setFailureImage(Drawable failureDrawable,ScalingUtils.ScaleType failureImageScaleType) 设置失败图以及其缩放类型 GenericDraweeHierarchyBuilder setFailureImage(Drawable failureDrawable) 设置失败图，它默认的缩放类型是CENTER_INSIDE

  修改我们刚刚书写的 activity_main.xml :

  <?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=".MainActivity">    <com.facebook.drawee.view.SimpleDraweeView        android:id="@+id/main_sdv"        android:layout_width="100dp"        android:layout_height="100dp"        android:layout_centerInParent="true" /></RelativeLayout>
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  

  代码分析：

  

  设置失败图方式一，修改我们刚刚书写的 MainActivity 里面的代码：

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    //需要下载的图片地址    //private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    private Uri imageUrl = Uri.parse("http://www.sonystyle.com.cn/activity/wallpaper/640x1136_w.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置占位图及它的缩放方式                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                //设置失败图，它默认的缩放类型是CENTER_INSIDE                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure))                //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  

  分析代码：

  

  设置失败图方式二，修改我们的 MainActivity 里面的代码：

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    //需要下载的图片地址    //private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    private Uri imageUrl = Uri.parse("http://www.sonystyle.com.cn/activity/wallpaper/640x1136_w.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置占位图及它的缩放类型                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                //设置失败图及其缩放类型                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure), ScalingUtils.ScaleType.FOCUS_CROP)                //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  

  分析代码：

  

  两种设置失败图方式大家择其一，运行一下，看看效果：

  

• 重试图—retryImage：

  在此之前我们需要一张重试图 icon_retry.png 大家右键另存为即可：

  

  设置重试图它有两个方法，分别是：

  限定符和类型 方法 说明 GenericDraweeHierarchyBuilder setRetryImage(Drawable retryDrawable,ScalingUtils.ScaleType retryImageScaleType) 设置重试图以及其缩放类型 GenericDraweeHierarchyBuilder setRetryImage(Drawable retryDrawable) 设置重试图，它默认的缩放类型是CENTER_INSIDE

  设置重试图方式一，修改我们刚刚书写的 MainActivity 里的代码 :

  public class MainActivity extends AppCompatActivity {    private SimpleDraweeView sdv;    //需要下载的图片地址    //private Uri imageUrl = Uri.parse("http://my.csdn.net/uploads/avatar/4/E/8/1_y1scp.jpg");    private Uri imageUrl = Uri.parse("http://www.sonystyle.com.cn/activity/wallpaper/640x1136_w.jpg");    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //初始化Fresco        Fresco.initialize(this);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置占位图及它的缩放类型                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                //设置失败图及其缩放类型                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure), ScalingUtils.ScaleType.FOCUS_CROP)                //设置重试图，它默认的缩放类型是CENTER_INSIDE                .setRetryImage(ContextCompat.getDrawable(this, R.mipmap.icon_retry))                //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);        //构建Controller        DraweeController controller = Fresco.newDraweeControllerBuilder()                //设置点击重试是否开启                .setTapToRetryEnabled(true)                //构建                .build();        //设置Controller        sdv.setController(controller);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  44
  45
  46
  47
  48
  49
  50
  51
  

  代码分析：

  

  设置重试图方式二，由于代码一屏展示有点浪费空间，影响阅读性，所以展示有改动的代码部分，没有展示出来的代码是没有改变过的：

  public class MainActivity extends AppCompatActivity {    ......    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置占位图及它的缩放类型                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                //设置失败图及其缩放类型                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure), ScalingUtils.ScaleType.FOCUS_CROP)                //设置重试图及其缩放类型                .setRetryImage(ContextCompat.getDrawable(this, R.mipmap.icon_retry), ScalingUtils.ScaleType.FOCUS_CROP)                //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);        //构建Controller        DraweeController controller = Fresco.newDraweeControllerBuilder()                //设置点击重试是否开启                .setTapToRetryEnabled(true)                //构建                .build();        //设置Controller        sdv.setController(controller);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  

  代码分析：

  

  两种设置重试图方式大家择其一，运行一下，看看效果：

  

• 淡入淡出动画—setFadeDuration：

  设置淡入淡出它只有一个方法：

  限定符和类型 方法 说明 GenericDraweeHierarchyBuilder setFadeDuration(int fadeDuration) 设置淡入淡出动画持续时间(单位：毫秒ms)

  修改我们刚刚书写的 MainActivity 里的代码：

  public class MainActivity extends AppCompatActivity {    ......    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置淡入淡出动画持续时间                .setFadeDuration(5000)                //设置占位图及它的缩放类型                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置失败图及其缩放类型                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置重试图及其缩放类型                .setRetryImage(ContextCompat.getDrawable(this, R.mipmap.icon_retry), ScalingUtils.ScaleType.FOCUS_CROP)                        //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);        //构建Controller        DraweeController controller = Fresco.newDraweeControllerBuilder()                //设置点击重试是否开启                .setTapToRetryEnabled(true)                        //构建                .build();        //设置Controller        sdv.setController(controller);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  

  代码分析：

  

  我们运行一下，看看效果：

  

• 背景图—setBackground(s)：

  设置背景图它有两个方法，分别是：

  限定符和类型 方法 说明 GenericDraweeHierarchyBuilder setBackground(Drawable background) 设置一张背景图 GenericDraweeHierarchyBuilder setBackgrounds(List< Drawable> backgrounds) 设置一组背景图

  好，大家可以看到，我们不光可以设置一张背景图还可以设置一组背景图，那么我们就准备3张照片，也不准备太多，演示足够了：

  bg_zero.png bg_one.png bg_two.png

  大家将上面三张图右键另存为即可，保存完了之后呢，修改我们刚刚书写的 MainActivity 里的代码，设置单张背景图：

  public class MainActivity extends AppCompatActivity {    ......    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置淡入淡出动画持续时间                .setFadeDuration(5000)                //设置单张背景图                .setBackground(ContextCompat.getDrawable(this,R.mipmap.bg_zero))                //设置占位图及它的缩放类型                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置失败图及其缩放类型                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置重试图及其缩放类型                .setRetryImage(ContextCompat.getDrawable(this, R.mipmap.icon_retry), ScalingUtils.ScaleType.FOCUS_CROP)                        //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);        //构建Controller        DraweeController controller = Fresco.newDraweeControllerBuilder()                //设置点击重试是否开启                .setTapToRetryEnabled(true)                        //构建                .build();        //设置Controller        sdv.setController(controller);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  

  代码分析：

  

  运行一下，看看效果：

  

  接下来，我们试试设置多张背景图是什么效果，修改我们刚刚书写的 MainActivity 里的代码：

  public class MainActivity extends AppCompatActivity {    ......    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //初始化多张背景图集合        List<Drawable> bgs = new ArrayList<Drawable>();        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_zero));        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_one));        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_two));        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置淡入淡出动画持续时间                .setFadeDuration(5000)                //设置单张背景图                //.setBackground(ContextCompat.getDrawable(this,R.mipmap.bg_zero))                //设置多张背景图                .setBackgrounds(bgs)                //设置占位图及它的缩放类型                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置失败图及其缩放类型                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置重试图及其缩放类型                .setRetryImage(ContextCompat.getDrawable(this, R.mipmap.icon_retry), ScalingUtils.ScaleType.FOCUS_CROP)                        //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);        //构建Controller        DraweeController controller = Fresco.newDraweeControllerBuilder()                //设置点击重试是否开启                .setTapToRetryEnabled(true)                        //构建                .build();        //设置Controller        sdv.setController(controller);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  44
  45
  46
  47
  48
  49
  50
  51
  

  代码分析：

  

  我们运行一下，看看效果：

  

  可以看到，多张的背景图是叠加在一起的，而单张的就不存在这种现象；所以大家怎么去使用设置背景图的这两个方法，就要看各自的需求了。

• 叠加图—setOverlay：

  设置叠加图图它有两个方法，分别是：

  限定符和类型 方法 说明 GenericDraweeHierarchyBuilder setOverlay(Drawable overlay) 设置单张叠加图 GenericDraweeHierarchyBuilder setOverlays(List< Drawable> overlays) 设置多张叠加图

  大家可以看到的是，我们不光可以设置一张叠加图，还可以设置多张叠加图，接下来大家将下列图片右键另存为即可：

  overlay_one.png overlay_two.png overlay_three.png

  设置单张叠加图，修改我们刚刚书写的 MainActivity 里的代码 :

  public class MainActivity extends AppCompatActivity {    ......    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //初始化多张背景图集合        List<Drawable> bgs = new ArrayList<Drawable>();        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_zero));        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_one));        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_two));        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置淡入淡出动画持续时间                .setFadeDuration(5000)                //设置单张背景图                //.setBackground(ContextCompat.getDrawable(this,R.mipmap.bg_zero))                //设置多张背景图                .setBackgrounds(bgs)                //设置单张叠加图                .setOverlay(ContextCompat.getDrawable(this,R.mipmap.overlay_one))                //设置占位图及它的缩放类型                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置失败图及其缩放类型                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置重试图及其缩放类型                .setRetryImage(ContextCompat.getDrawable(this, R.mipmap.icon_retry), ScalingUtils.ScaleType.FOCUS_CROP)                        //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);        //构建Controller        DraweeController controller = Fresco.newDraweeControllerBuilder()                //设置点击重试是否开启                .setTapToRetryEnabled(true)                        //构建                .build();        //设置Controller        sdv.setController(controller);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  44
  45
  46
  47
  48
  49
  50
  51
  52
  53
  

  代码分析：

  

  我们运行一下，看看效果：

  

  可以看到，从开始加载直到加载完毕都是被叠加图覆盖了，接下来设置多张叠加图，修改我们刚刚书写的 MainActivity 里的代码：

  public class MainActivity extends AppCompatActivity {    .....    private void initView() {        //获取SimpleDraweeView        sdv = (SimpleDraweeView) findViewById(R.id.main_sdv);        //初始化多张背景图集合        List<Drawable> bgs = new ArrayList<Drawable>();        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_zero));        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_one));        bgs.add(ContextCompat.getDrawable(this,R.mipmap.bg_two));        //初始化多张叠加图集合        List<Drawable> overlays = new ArrayList<Drawable>();        overlays.add(ContextCompat.getDrawable(this,R.mipmap.overlay_one));        overlays.add(ContextCompat.getDrawable(this,R.mipmap.overlay_two));        overlays.add(ContextCompat.getDrawable(this,R.mipmap.overlay_three));        //获取GenericDraweeHierarchy对象        GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources())                //设置淡入淡出动画持续时间                .setFadeDuration(5000)                //设置单张背景图                //.setBackground(ContextCompat.getDrawable(this,R.mipmap.bg_zero))                //设置多张背景图                .setBackgrounds(bgs)                //设置单张叠加图                //.setOverlay(ContextCompat.getDrawable(this,R.mipmap.overlay_one))                //设置多张叠加图                .setOverlays(overlays)                //设置占位图及它的缩放类型                .setPlaceholderImage(ContextCompat.getDrawable(this, R.mipmap.icon_placeholder), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置正在加载图及其缩放类型                .setProgressBarImage(ContextCompat.getDrawable(this, R.mipmap.icon_progress_bar), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置失败图及其缩放类型                .setFailureImage(ContextCompat.getDrawable(this, R.mipmap.icon_failure), ScalingUtils.ScaleType.FOCUS_CROP)                        //设置重试图及其缩放类型                .setRetryImage(ContextCompat.getDrawable(this, R.mipmap.icon_retry), ScalingUtils.ScaleType.FOCUS_CROP)                        //构建                .build();        //设置GenericDraweeHierarchy        sdv.setHierarchy(hierarchy);        //开始下载        sdv.setImageURI(imageUrl);        //构建Controller        DraweeController controller = Fresco.newDraweeControllerBuilder()                //设置点击重试是否开启                .setTapToRetryEnabled(true)                        //构建                .build();        //设置Controller        sdv.setController(controller);    }}
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  44
  45
  46
  47
  48
  49
  50
  51
  52
  53
  54
  55
  56
  57
  58
  59
  60
  61
  

  代码分析：

  

  运行一下，看看效果：

  

  可以看到显示的是最后加入集合的图，大家自己可以试着将其它两张图片轮番着放在最后一个加入，然后运行看看效果。

• Github：

  本教程最终Github地址：https://github.com/scp504677840/Fresco