Android--Glide图片加载框架的基本使用与介绍

最新推荐文章于 2024-04-22 19:23:00 发布

Amandu1995

最新推荐文章于 2024-04-22 19:23:00 发布

阅读量858

点赞数 2

分类专栏： android 文章标签： android 图片框架 android studio

本文链接：https://blog.csdn.net/Amanduzhuojiang/article/details/78550767

版权

android 专栏收录该内容

22 篇文章 0 订阅

订阅专栏

前言：

众所周知，一个优秀的App是离不开图片加载框架的，因为学会了图片加载框架的你，就能够利用图片加载框架从而去加载网络上面的各种漂亮的图片，然后显示在App上面给用户看的。所以说图片加载是非常重要的。那么如何利用Android去加载网络图片的，相信不少朋友都知道，从最早的UniversalImageLoader加载框架到后来的Picasso加载框架，再从Picasso加载框架到现在最火的Glide加载框架。目前Glide虽然确实很火，同时它也是谷歌推荐使用，现在也被众多的开发者所利用，因为这个框架功能十分强大，关于有哪些功能，下面将逐渐为大家介绍，所以接下来，让我们一起来学习图片加载框架Glide使用。

前期准备工作：

Android Studio开发者：新建一个GlideDemo项目，然后在build.gradle下添加相关依赖文件：

dependencies {  
    compile 'com.github.bumptech.glide:glide:3.7.0'  
}

eclipse开发者：请自行到网上查找相关Glide的jar包。

由于Glide加载图片是需要网络访问操作的，所以在清单文件中顺便添加网络权限：

<uses-permission android:name="android.permission.INTERNET"></uses-permission>

这样，我们前期准备工作就完成了，接下来我们就可以使用Glide来探索加载图片功能了。

简单使用：

现在前期准备工作已经完成了，那么迫不及待的你肯定想知道如何加载网络一张图片的，在这里，为了演示加载网络上一张图片，必须要有一个图片地址。所以我特意去网上随便找了一个图片地址，地址信息如下：

https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg

现在图片地址有了，那么接下来我们就可以在自己程序中通过Glide去加载这张图片。

首先新建一个布局名称叫做：activity_main，具体代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    xmlns:tools="http://schemas.android.com/tools"  
    android:id="@+id/activity_main"  
    android:orientation="vertical"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    tools:context="com.soft0754.glidetext.MainActivity">  
  
    <Button  
        android:onClick="loadImage"  
        android:layout_width="match_parent"  
        android:layout_height="wrap_content"  
        android:text="Load Image" />  
  
    <ImageView  
        android:id="@+id/image_view"  
        android:layout_width="match_parent"  
        android:layout_height="match_parent" />  
</LinearLayout>

这里介绍一下，就是新建一个button控件用于做点击事件去加载，还有一个ImageView控件用于显示加载好的图片。只不过在button中，我直接在里面写入了onClick点击事件，省去查找button的id这个步骤。

接下来，为了让按钮点击之后通过Glide去加载这张图片，所以我们还需要在MainActivity,Java加入如下代码：

public class MainActivity extends AppCompatActivity {    
    
    private ImageView imageView;    
    
    @Override    
    protected void onCreate(Bundle savedInstanceState) {    
        super.onCreate(savedInstanceState);    
        setContentView(R.layout.activity_main);    
        imageView = (ImageView) findViewById(R.id.image_view);    
    }    
    
    //利用Glide加载网络图片    
    public void loadImage(View view){    
        String image_url="https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg";    
        Glide.with(MainActivity.this).load(image_url).into(imageView);    
    }    
}

没错，就是这么简单，现在好了，那我们先直接运行demo看看。

现在我们可以看到，一张网络图片已经被我们利用Glide给加载下来了，至于为什么能够加载，其实核心代码只有下面这一句：

Glide.with(MainActivity.this).load(image_url).into(imageView);

大家此时都已经看到传递其实只有三个参数，没错，确实是的，那么我就解释一下各个参数的意义：

首先调用Glide.with创建一个Glide加载图片框架的实例，然后有了这个实例之后，我们就可以通过调用Glide源码里面各种静态方法了来实现各种Glide功能了，然后参数1表示当前上下文、参数2表示加载图片地址路径（这里值得注意的是该地址指定类型分别右如下几种：File、Drawable、Url等等，但是这里我默认使用了Url，有关地址路径其他类别以后我们有空再讲解）、参数3表示图片加载控件的对象。

现在相信大家看完了，都能够简单的使用Glide去加载网络上图片了。但有时候，我们做项目并不能这么简单的使用，要考虑的问题还有很多，比如加载网络图片时候所需的占位图、加载网络图片时失败的返回的图片、甚至指定图片大小等等，这些Glide已经帮我们考虑好了，所以我们只需要学习Glide更多功能的用法去完成就行了。

Glide占位图:

所谓的占位图，日常开发中常见有两种：一种是普通占位图，一种是错误占位图，有关错误占位图下面我们再讲解，首先看看普通占位图，普通占位图其实就是图片在加载过程中，我们要先显示一张临时的图片，等图片加载出来了再替换成我们加载完成后的图片。不知道大家有没有细心的发现，上面我们学习了Glide基本使用之后，点击加载图片的瞬间，是先空白的闪了一下，然后才把我们加载好了的网络图片显示出来的，这样是很不友好的，因为Glide加载网络图片是需要耗时的，所以当你App有大量网络图片数据的时候，加载起来是非常耗时的，如果我们不做占位图这种友好显示来提醒用户，万一用户看到瞬间空白是怎么想的？那么下面我们一起来学习Glide占位图的使用方法。

首先我准备好了一张名为：placeholder.jpg，并且把它放在drawable目录下，作为Glide占位图的加载图片对象。具体代码如下：

public void loadImage(View view){    
       String image_url="https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg";    
       Glide.with(MainActivity.this).load(image_url).placeholder(R.drawable.placeholder).into(imageView);

现在重新运行代码,效果如下：

现在看起显得比较友好了一些，不会像刚开始那样，加载时候瞬间是空白的，那么有关于占位图，其实就是通过Glide实例中调用placeholder()这个方法，然后将占位图资源传入这个方法里面就可以。这个方法传入参数目前仅仅支持resourceId，也就是我们的drawable资源文件。

现在有了占位图，似乎一切看起来是那么友好了，但是大家有没有细心考虑过，当网络出现异常或者没有网络的时候呢，我们通过Glide去加载一张网络图片会发生什么事情呢？在这里大家可能会觉得既然没有网络了，那加载图片肯定显示不出来，那么到底是不是呢，接下让来我们拭目以待吧，首先，我自行把模拟器网络关闭了，再运行demo来试试，具体效果图如下：

纳尼，为什么会这样的......！在这里，你可能会产生一个疑问，为什么没有网络了，网络图片还能加载出来，没错，确实是如此！因为Glide这个强大的图片加载框架具有默认缓存功能，只要加载过一次网络图片了，它就自动缓存到本地磁盘里面去，有关于缓存到磁盘，在以后有时间我们再进行学习。那么一旦没有网络情况下，Glide是会自动加载磁盘中的缓存图片数据来显示的，这样是很显得很不合理的，因此，我们需要禁止默认Glide图片缓存，那么如何禁止图片缓存呢？其实只要修改如下具体代码：

 public void loadImage(View view){  
        String image_url="https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg";  
        Glide.with(MainActivity.this).load(image_url).diskCacheStrategy(DiskCacheStrategy.NONE).placeholder(R.drawable.placeholder);

没错，就是通过Glide.with实例去调用diskCacheStrategy（DiskCacheStrategy.NONE）这个方法，就可以实现Glide禁止默认缓存功能了。那么现在我们禁止缓存了，再运行一下demo试试，效果图如下：

现在终于正常了，由于我们上面已经禁止Glide缓存功能，所以这里不再去加载缓存图片数据了。但是细心的你肯定会发现，现在虽然不去加载缓存图片数据了，但是为什么还剩下普通占位图呢？确实如此！因为针对Glide没有网络时候，你还需要特定去指定Glide错误占位图，有关错误占位图，意思其实就是当网络出现异常，或者没有网络时候，我们还需要通过Glide去处理，那么错误占位图具体代码如下:

 //利用Glide加载网络图片
    public void loadImage(View view){
        String image_url="https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg";
        Glide.with(MainActivity.this).load(image_url).diskCacheStrategy(DiskCacheStrategy.NONE).error(R.drawable.error).into(imageView);
    }

很简单，这里同样用Glide.with实例去调用error()这个方法就是实现错误占位图操作了，那么现在为了能过实现，我们照样还是把模拟器网络给关闭，然后运行demo，效果图如下：

在没有网络情况下，错误占位图确实显示出来了，一般优秀的App UI设计当中，都会给出一些没有网络，或者一些默认图片去友好的提示用户。那么现在我们总算把Glide里面常见基本用法和占位图都给学习了。

大家现在回顾一下，原来Glide图片加载框架的使用确实很简单，确实如此！但是接下来，下面还将会有一些更高级的用法等着我们去学习，毕竟我前面也说过了，Glide图片加载框架是十分丰富的，所以为了更好的使用和理解Glide，那么下面将为大家再继续简单地介绍Glide的图片缩放模式、以及指定图片大小等等。

Glide图片缩放模式:

所谓图片缩放模式在Glide常见方法中只有两种，一种是fitCenter,一种是centerCrop。那么这两个分别有什么作用呢？打个比方来说，比如我上面那个布局文件当中ImageView控件设置了match_parent,而我加载图片是如下这个：

https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg

那么当你加载完成你会发现，既然我使用match_parent了，为什么不会显示全屏呢？而是图片自适应呢？答案其实就是涉及到Glide缩放模式，一说到缩放模式，那么你可能会立马回答，既然是图片缩放模式了，那我直接是ImageView控件当中设置scaleType="centerCrop"不就行了，确实是可以的，但是既然我们采用了Glide加载图片框架，我们同样也可以通过Glide.with实例去调用centerCrop()这个方法来实现scaleType="centerCrop"一样的功能，那么具体代码和效果图分别如下:

//利用Glide加载网络图片
    public void loadImage(View view){
        String image_url="https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg";
        Glide.with(MainActivity.this).load(image_url).placeholder(R.drawable.placeholder).error(R.drawable.error).diskCacheStrategy(DiskCacheStrategy.NONE).into(imageView);
    }

同样的，如果你不想实现图片全屏缩放模式，而是采用图片地址有多大而多大来显示，换句话说应该叫做自适应模式，那么如何实现呢？其实你可以通过Glide.with实例去调用fitCenter()这个方法来实现，只要我们把上面的centerCrop替换成fitCenter就可以了，那么具体代码和效果图分别如下:

 //利用Glide加载网络图片
    public void loadImage(View view){
        String image_url="https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg";
        Glide.with(MainActivity.this).load(image_url).placeholder(R.drawable.placeholder).fitCenter().error(R.drawable.error).diskCacheStrategy(DiskCacheStrategy.NONE).into(imageView);
    }

现在我们顺便也把Glide图片缩放模式给学习了，其实说到缩放模式的好处在于，当你日常开发当中，一些来自服务器上面图片地址格式转换显示罢了，如果看到那些图片缩放模式并不是我们想要的，那么就可以通过Glide图片缩放模式去特定地指定它。

Glide图片指定大小：

在开发中，有时候我们图片加载并不是采用缩放模式的，万一哪天产品经理有个还样一种需求，就是把图片设置为固定值，那么一说到固定值，Glide同样的也帮我们考虑好了，所以我们只需要通过Glide.with这个实例去调用override（）这个方法就行了，这个方法需要我们传入两个参数，一个是height，一个是width，就是图片的指定宽高格式，那么这里随便我们设置就行了，具体代码和效果图如下:

//利用Glide加载网络图片
    public void loadImage(View view){
        String image_url="https://img-my.csdn.net/uploads/201407/26/1406383243_5120.jpg";
        Glide.with(MainActivity.this).load(image_url).placeholder(R.drawable.placeholder).error(R.drawable.error).diskCacheStrategy(DiskCacheStrategy.NONE).override(500,500).into(imageView);
    }

在这里值得注意的是，针对Glide设置图片固定大小，我们不能把ImageView控件设置为match_parent，当你设置了match_parent你会发现调用override指定图片大小是起不到作用的，那是因为默认Glide源码当中会自动去判断当前如果ImageView控件为match_parent时候，是不允许你去调用override这个方法的，所以，为了能够通过Glide指定图片大小，我们必须把ImageView控件设置为wrap_content。

好了，今天Glide基本用法已经学完了，有关于Glide其他功能用法还有很多的，比如图片缓存策略，图片变换功能，更改Glide自定义模块等等，由于时间关系，所以今天暂时讲到这里，以后有时间我们再继续学习！