Android图片加载框架:Glide的常用用法|SquirrelNote

96
跳动的松鼠
2017.11.18 22:28* 字数 1969

我的系列文章
Android图片加载框架:Glide的常用用法|SquirrelNote
Android图片加载框架:Glide源码解析|SquirrelNote

前言

现在Android上的图片加载框架非常成熟,从最早的图片加载框架UniversalImageLoader,到后来Google推出的Volley,再到后来的Glide和Picasso,当然还有Facebook的Fresco。每一个都非常稳定,功能也都十分强大。但是它们的使用场景基本都是重合的,也就是说我们基本只需要选择其中一个来进行学习和使用就足够了,每一个框架都尝试去掌握的话则有些浪费时间。

框架的选择
从易用性上来讲,Glide和Picasso应该都是完胜其他框架的,这两个框架都简单好用,大多数情况下加载图片都是一行代码就能解决的.

Glide和Picasso比较
Picasso所能实现的功能,Glide都能做,区别是所需的设置不同。Picasso比Glide更加简洁轻量,Glide比Picasso功能更为丰富。Glide的好处是大型的图片流,比如gif动态图、Video,如果是做美拍、爱拍这种视频类应用,建议使用。
如果项目中网络请求本身用的是Square公司的全家桶,比如OkHttp或者retrofit(本质还是OkHttp),那么建议搭配Picasso一起使用,兼容性可能会更好些,占用体积也会少些。
经过多方面对比之后,我还是决定选择了Glide来进行研究,并且这也是Google官方推荐的图片加载框架。

下面对Glide常用用法进行详细介绍:

  1. Glide的用法
  2. 占位图功能
  3. 指定图片格式(支持加载Gif图片)

Glide的用法

GitHub开源框架:https://github.com/bumptech/glide
目前,Glide最新的稳定版本是3.7.0,虽然4.0已经推出RC版了,但是暂时问题还比较多。
新建一个GlideDemo项目,然后在app/build.gradle文件当中添加如下依赖:
compile 'com.github.bumptech.glide:glide:3.7.0'
注意:使用4.0版本出容易bug

另外,Glide中需要用到网络功能,因此要在AndroidManifest.xml中声明一下网络权限:
<uses-permission android:name="android.permission.INTERNET" />

加载图片

使用Glide如何加载图片,如下tomcat服务器上的照片:
http://192.168.6.102:8080/songshu.jpg

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    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"
    android:orientation="vertical"
    tools:context="com.glidedemo.activity.GlideTestActivity">

    <Button
        android:id="@+id/btn_glide"
        android:text="使用Glide显示加载图片"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
    <ImageView
        android:id="@+id/iv_glide"
        android:layout_gravity="center"
        android:layout_width="100dp"
        android:layout_height="100dp"/>

</LinearLayout>
@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_glide_test);

        mBtn_glide = (Button) findViewById(R.id.btn_glide);
        mImageView = (ImageView) findViewById(R.id.iv_glide);

        //设置点击监听
        mBtn_glide.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                loadImage();
            }
        });
    }

    private void loadImage() {
        String url="http://192.168.6.102:8080/songshu.jpg";
        Glide.with(this).load(url).into(mImageView);
    }
image.gif

核心代码只有一行:
Glide.with(this).load(url).into(mImageView);
这一行代码可以做很多事情,加载网络上的图片、加载手机本地的图片、加载应用资源中的图片等等。

解析这一行代码:
调用Glide.with()方法用于创建一个加载图片的实例。with()方法可以接收Context、Activity或者Fragment类型的参数,即可以直接传this。如果调用的地方不在Activity、Fragment,可以获取当前应用程序的ApplicationContext,传入到with()方法当中。
注意:with()方法中传入的实例会决定Glide加载图片的生命周期,如果传入的是Activity或者Fragment的实例,那么当这个Activity或Fragment被销毁的时候,图片加载也会停止。如果传入的是ApplicationContext,那么只有当应用程序被杀掉的时候,图片加载才会停止。

Glide支持加载各种各样的图片资源,包括网络图片、本地图片、应用资源、二进制流、Uri对象等等。load()方法有很多个方法重载,如下:

// 加载本地图片
File file = new File(getExternalCacheDir() + "/image.jpg");
Glide.with(this).load(file).into(imageView);

// 加载应用资源
int resource = R.drawable.image;
Glide.with(this).load(resource).into(imageView);

// 加载二进制流
byte[] image = getImageBytes();
Glide.with(this).load(image).into(imageView);

// 加载Uri对象
Uri imageUri = getImageUri();
Glide.with(this).load(imageUri).into(imageView);

我们希望图片显示在哪个ImageView当中,就把这个ImageView实例传入into()方法里,into()方法不仅能接收ImageView类型的参数,还支持很多丰富的用法(属于高级技巧)。

Glide基本使用方式,三步:先with(),再load(),最后into()。熟记这三步,就已经入门了。

占位图功能

因为从网络上下载图片需要时间,Glide提供了各种各样的非常丰富的API支持,其中就包括了占位图功能。占位图:指在图片加载过程中,我们先显示一张临时图片,等图片加载出来了再替换成要加载的图片。

准备好一张图片loading.jpg,代码如下:

Glide.with(this)
                .load(url)
                .placeholder(R.drawable.loading)
                .into(mImageView);

如果再重新点击按钮,可能看不到占位图效果。因为Glide有非常强大的缓存机制,我们刚才加载那张必应美图的时候Glide自动就已经将它缓存下来了,下次加载的时候将会直接从缓存中读取,不会再去网络下载了,因而加载的速度非常快,所以占位图可能根本来不及显示。修改如下:

Glide.with(this)
                .load(url)
                .placeholder(R.drawable.loading)//占位图
                .diskCacheStrategy(DiskCacheStrategy.NONE)//禁用Glide的缓存功能
                .into(mImageView);

显示效果如下:


占位图.gif

异常占位图
如果因为某些异常情况导致图片加载失败,比如说手机网络信号不好,这个时候就这张显示异常占位图。

Glide.with(this)
                .load(url)
                .placeholder(R.drawable.loading)//占位图
                .error(R.drawable.error)//异常占位图,比如手机没网络,加载图片失败
                .diskCacheStrategy(DiskCacheStrategy.NONE)//禁用Glide的缓存功能
                .into(mImageView);

显示效果如下:


异常占位图.gif

以上就是Glide的占位图功能。

指定图片格式(支持加载Gif图片)

相比Picasso,Picasso不支持加载Gif图片。
把上面的url替换成一个gif图片,效果如下图所示:


加载gif图片.gif

Glide会自动进行判断是普通图片,还是gif图片,并且可以正确地把它解析并展示出来。

但是如果我想指定图片的格式该怎么办呢?就比如说,我希望加载的这张图必须是一张静态图片,我不需要Glide自动帮我判断它到底是静图还是GIF图。

Glide.with(this)
                .load(url)
                .asBitmap()//只允许加载静态图片,不需要Glide去帮我们自动进行图片格式判断
                //.asGif()//强制加载动态图片
                .placeholder(R.drawable.loading)//占位图
                .error(R.drawable.error)//异常占位图,比如手机没网络,加载图片失败
                .diskCacheStrategy(DiskCacheStrategy.NONE)//禁用Glide的缓存功能
                .into(mImageView);

调用了asBitmap()方法,现在GIF图就无法正常播放了,而是会在界面上显示第一帧的图片。

同理,如果调用asGif()方法,强制加载动态图片。如果传入的是静态图片,结果会是加载失败。

指定图片大小

实际上,使用Glide在绝大多数情况下是不需要指定图片大小的。

我们平时在加载图片的时候很容易会造成内存浪费。什么叫内存浪费呢?比如说一张图片的尺寸是1000 * 1000像素,但是我们界面上的ImageView可能只有200 * 200像素,这个时候如果你不对图片进行任何压缩就直接读取到内存中,这就属于内存浪费了,因为程序中根本就用不到这么高像素的图片。

关于图片压缩,我的另一篇文章:Android性能优化:图片的加载和图片缓存技术|SquirrelNote

Glide会自动判断ImageView的大小,然后只将这么大的图片像素加载到内存当中,帮助我们节省内存。它的内部实现原理,就是上面一篇文章所介绍的技术,掌握了最基本的实现原理,我们也可以自己实现一套这样的图片压缩机制。

如果需要给图片指定一个固定的大小的需求,如下代码:

Glide.with(this)
                .load(url)
//                .asBitmap()//只允许加载静态图片,不需要Glide去帮我们自动进行图片格式判断
                .placeholder(R.drawable.loading)//占位图
                .error(R.drawable.error)//异常占位图,比如手机没网络,加载图片失败
                .diskCacheStrategy(DiskCacheStrategy.NONE)//禁用Glide的缓存功能
                .override(200,200)
                .into(mImageView);

override()方法指定了一个图片的尺寸。

以上是根据我的一些理解,做的总结分享,旨在抛砖引玉,希望有更多的志同道合的朋友一起讨论学习,共同进步!

参考文献:
http://blog.csdn.net/guolin_blog/article/details/53759439

Android图片加载框架
Gupao