Glide完全解析(⼀)初步使⽤完全教程教程
⼀、背景
现在Android上的图⽚加载框架⾮常成熟,从最早的⽼牌图⽚加载框架UniversalImageLoader,到后来Google 推出的Volley,再到后来的新兴军Glide和Picasso,当然还有Facebook的Fresco。每⼀个都⾮常稳定,功能也都⼗分强⼤。但是它们的使⽤场景基本都是重合的,也就是说我们基本只需要选择其中⼀个来进⾏学习和使⽤就⾜够了,每⼀个框架都尝试去掌握的话则有些浪费时间。
在这⼏个框架当中,我对Volley和Glide研究得⽐较深⼊,对UniversalImageLoader、Picasso和Fresco都只是有⼀些基本的了解。从易⽤性上来讲,Glide和Picasso应该都是完胜其他框架的,这两个框架都实在是太简单好⽤了,⼤多数情况下加载图⽚都是⼀⾏代码就能解决的,⽽UniversalImageLoader和Fresco则在这⽅⾯略逊⼀些。
总之,没有最好的框架,只有最适合⾃⼰的框架。经过多⽅⾯对⽐之后,我还是决定选择了Glide来进⾏研究,并且这也是Google官⽅推荐的图⽚加载框架。
之前在看郭霖⼤佬对于glide的源码分析,不得不说郭霖⼤佬写博客真的很详细,理解也⾮常透彻,看完真的感觉很不错,不过现在glide出了4.0版本,其源码对实现过程还是做了很⼤的调整,让其可读性和架
构更加好,我试图想通过⾃⼰的理解去写完glide的实现原理,当然由于⾃⼰⽔平有限,时间也不充裕,可能不知道能不能写完,也可能分析得不到位,可能还要借鉴⼤佬们的博客,取其精华,去其糟粕,总之有⼀个好的开始才有可能写成⾃⼰喜欢的博客。
⼆、准备⼯作
要想使⽤Glide,⾸先需要将这个库引⼊到我们的项⽬当中。新建⼀个Glide4Test项⽬,然后在
adle⽂件当中添加如下依赖:
dependencies {
implementation 'com.github.bumptech.glide:glide:4.4.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.4.0'
}
另外,Glide中需要⽤到⽹络功能,因此你还得在l中声明⼀下⽹络权限才⾏:<uses-permission android:name="android.permission.INTERNET" />
就是这么简单,然后我们就可以⾃由地使⽤Glide中的任意功能了。
三、简单使⽤
然后我们想要在程序当中去加载这张图⽚。
那么⾸先打开项⽬的布局⽂件,在布局当中加⼊⼀个Button和⼀个ImageView,如下所⽰:
<LinearLayout xmlns:android="schemas.android/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Load Image"
android:onClick="loadImage"
/>
<ImageView
android:id="@+id/image_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
为了让⽤户点击Button的时候能够将刚才的图⽚显⽰在ImageView上,我们需要修改MainActivity中的代码,如下所⽰:
public class MainActivity extends AppCompatActivity {
ImageView imageView;
@Override
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.activity_main);
imageView = (ImageView) findViewById(R.id.image_view);
}
public void loadImage(View view) {
String url = "h/book.png";
Glide.with(this).load(url).into(imageView);
}
}
没错,就是这么简单。现在我们来运⾏⼀下程序,效果如下图所⽰:
android学习教程可以看到,⼀张⽹络上的图⽚已经被成功下载,并且展⽰到ImageView上了。
你会发现,到⽬前为⽌,Glide 4的⽤法和Glide 3是完全⼀样的,实际上核⼼的代码就只有这⼀⾏⽽已:Glide.with(this).load(url).into(imageView);
好了,现在你已经成功⼊门Glide 4了,那么接下来就让我们学习⼀下Glide 4的更多⽤法吧。
四、占位图
观察刚才加载⽹络图⽚的效果,你会发现,点击了Load Image按钮之后,要稍微等⼀会图⽚才会显⽰出来。这其实很容易理解,因为从⽹络上下载图⽚本来就是需要时间的。那么我们有没有办法再优化⼀下⽤户体验呢?当然可以,Glide提供了各种各样⾮常丰富的API⽀持,其中就包括了占位图功能。
顾名思义,占位图就是指在图⽚的加载过程中,我们先显⽰⼀张临时的图⽚,等图⽚加载出来了再替换成要加载的图⽚。
下⾯我们就来学习⼀下Glide占位图功能的使⽤⽅法,⾸先我事先准备好了⼀张loading.jpg图⽚,⽤来作为占位图显⽰。然后修改Glide加载部分的代码,如下所⽰
RequestOptions options = new RequestOptions()
.placeholder(R.drawable.loading);
Glide.with(this)
.load(url)
.apply(options)
.into(imageView);
没错,就是这么简单。这⾥我们先创建了⼀个RequestOptions对象,然后调⽤它的placeholder()⽅法来指定占位图,再将占位图⽚的资源id传⼊到这个⽅法中。最后,在Glide的三步⾛之间加⼊⼀个apply()⽅法,来应⽤我们刚才创建的RequestOptions对象。
不过如果你现在重新运⾏⼀下代码并点击Load Image,很可能是根本看不到占位图效果的。因为Glide有⾮常强⼤的缓存机制,我们刚才加载图⽚的时候Glide⾃动就已经将它缓存下来了,下次加载的时候将会直接从缓存
中读取,不会再去⽹络下载了,因⽽加载的速度⾮常快,所以占位图可能根本来不及显⽰。
因此这⾥我们还需要稍微做⼀点修改,来让占位图能有机会显⽰出来,修改代码如下所⽰:
RequestOptions options = new RequestOptions()
.placeholder(R.drawable.loading)
.diskCacheStrategy(DiskCacheStrategy.NONE);
Glide.with(this)
.load(url)
.apply(options)
.into(imageView);
可以看到,这⾥在RequestOptions对象中⼜串接了⼀个diskCacheStrategy()⽅法,并传⼊DiskCacheStrategy.NONE参数,这样就可以禁⽤掉Glide的缓存功能。
关于Glide缓存⽅⾯的内容我们待会⼉会进⾏更详细的讲解,这⾥只是为了测试占位图功能⽽加的⼀个额外配置,暂时你只需要知道禁⽤缓存必须这么写就可以了。
现在重新运⾏⼀下代码,效果如下图所⽰:
可以看到,当点击Load Image按钮之后会⽴即显⽰⼀张占位图,然后等真正的图⽚加载完成之后会将占位图替换掉。
除了这种加载占位图之外,还有⼀种异常占位图。异常占位图就是指,如果因为某些异常情况导致图⽚加载失败,⽐如说⼿机⽹络信号不好,这个时候就显⽰这张异常占位图。
异常占位图的⽤法相信你已经可以猜到了,⾸先准备⼀张error.jpg图⽚,然后修改Glide加载部分的代码,如下所⽰:
RequestOptions options = new RequestOptions()
.placeholder(R.drawable.ic_launcher_background)
.error()
.diskCacheStrategy(DiskCacheStrategy.NONE);
Glide.with(this)
.load(url)
.apply(options)
.into(imageView);
很简单,这⾥⼜串接了⼀个error()⽅法就可以指定异常占位图了。
其实看到这⾥,如果你熟悉Glide 3的话,相信你已经掌握Glide 4的变化规律了。在Glide 3当中,像placeholder()、error()、diskCacheStrategy()等等⼀系列的API,都是直接串联在Glide三步⾛⽅法中使⽤的。
⽽Glide 4中引⼊了⼀个RequestOptions对象,将这⼀系列的API都移动到了RequestOptions当中。这样做的好处是可以使我们摆脱冗长的Glide加载语句,⽽且还能进⾏⾃⼰的API封装,因为RequestOptions是可以作为参数传⼊到⽅法中的。
⽐如你就可以写出这样的Glide加载⼯具类:
public class GlideUtil {
public static void load(Context context,
String url,
ImageView imageView,
RequestOptions options) {
Glide.with(context)
.load(url)
.apply(options)
.into(imageView);
}
}
五、指定图⽚⼤⼩
#
RequestOptions options = new RequestOptions()
.override(200, 100);
Glide.with(this)
.
load(url)
.apply(options)
.into(imageView);
这样的话,Glide就不会再去⾃动压缩图⽚,⽽是会去加载图⽚的原始尺⼨。当然,这种写法也会⾯临着更⾼的OOM风险。
六、缓存机制
Glide的缓存设计可以说是⾮常先进的,考虑的场景也很周全。在缓存这⼀功能上,Glide⼜将它分成了两个模块,⼀个是内存缓存,⼀个是硬盘缓存。
这两个缓存模块的作⽤各不相同,内存缓存的主要作⽤是防⽌应⽤重复将图⽚数据读取到内存当中,⽽硬盘缓存的主要作⽤是防⽌应⽤重复从⽹络或其他地⽅重复下载和读取数据。
内存缓存和硬盘缓存的相互结合才构成了Glide极佳的图⽚缓存效果,那么接下来我们就来分别学习⼀下这两种缓存的使⽤⽅法。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论