Android图片加载库 Glide| 青训营笔记

260 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的第6天

1.Glide基本使用

图片占位符、错误符与后备回调符

1.1 Glid的引入:

Glide是一个快速高效的Android图片加载库,可以自动加载网络、本地文件,app资源中的图片,注重于平滑的滚动。

开源地址:github.com/bumptech/gl… 中文文档:muyangmin.github.io/glide-docs-…

引入Glide:

implementation 'com.github.bumptech.glide:glide:4.11.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.11.0'

基本使用:

Glide.with([fragment/Context/View])
    .load(url)
    .into(imageView);

1.2 Glide占位符:

Glide4中占位图的使用方法,包括(placeholder, error,fallback)三种占位图 1.placeholder 正在请求图片的时候展示的图片 2.error 如果请求失败的时候展示的图片 (如果没有设置,还是展示3.placeholder的占位符) 4.fallback 如果请求的url/model为 null 的时候展示的图片 (如果没有设置,还是展示placeholder的占位符)

代码示例:

RequestOptions requestOptions = new RequestOptions()
	.placeholder(R.drawable.hold)
                .error(R.drawable.error)
                .fallback(R.drawable.fallback)
	.override(100,100); //override指定加载图片大小

Glide.with([fragment/Context/View])
    .load(url)
    .apply(requestOptions)
    .into(imageView);

2.Glide进阶

加载动画与请求加载配置

圆角变换

Glide高级用法 Generated API

2.1过渡动画

定义 Glide 如何从占位符到新加载的图片,或从缩略图到全尺寸图像过渡。

交叉淡入(避免占位图还能显示)

DrawableCrossFadeFactory factory =
        new DrawableCrossFadeFactory.Builder().setCrossFadeEnabled(true).build();
Glide.with(context)
                .load(URL)
                .apply(requestOptions)
                .transition(DrawableTransitionOptions.withCrossFade(factory))
                .into((ImageView) holder.itemView);

为了提升性能,请在使用 Glide 向 ListView , GridView, 或 RecyclerView 加载图片时考虑避免使用动画

2. 2变换

获取资源并修改它,然后返回被修改后的资源。通常变换操作是用来完成剪裁或对位图应用过滤器。比如对图片进行圆角配置。 代码示例:

Glide.with(this)
                .load(URL)
                .transform(...)
                .into(iv);

1.CircleCrop:圆角

2.RoundedCorners: 四个角度统一指定

3.GranularRoundedCorners:四个角度单独指定

4.Rotate:旋转

在这里插入图片描述 在这里插入图片描述 在这里插入图片描述

2.3Generated API

1、添加 Glide 注解处理器的依赖:

dependencies {
  annotationProcessor 'com.github.bumptech.glide:compiler:4.11.0'
}

2、在 Application 模块中包含一个 AppGlideModule 的实现:

@GlideModule
public final class MyAppGlideModule extends AppGlideModule {}

此时我们能够更简单的完成占位符等配置:

GlideApp.with(fragment)
   .load(myUrl)
   .placeholder(R.drawable.placeholder)
   .into(imageView);

2.3GlideExtension与GlideOption

定义一个在频繁使用的选项集合。

@GlideExtension
public class MyAppExtension {

  private MyAppExtension() { } // utility class

  @GlideOption
  public static BaseRequestOptions<?> defaultImg(BaseRequestOptions<?> options) {
    return options
      .placeholder(R.drawable.hold)
      .error(R.drawable.error)
      .fallback(R.drawable.fallback);
  }

使用对比:

GlideApp.with().load().placeholder(R.drawable.holder).error(R.drawable.error).fallback(R.drawable.fallback)

GlideApp.with().load().defaultImg()