靠谱 的软件外包伙伴

您的位置:首页 > 新闻动态 > 图片软件开发加载框架Glide

图片软件开发加载框架Glide

2016-08-30 17:03:47

在Android设备上,加载网络图片一直是一个头疼的问题,因为Android设备种类繁多(当然最主要的是配置),处理的稍不周到轻则应用卡顿,严重者就会出现OOM的,导致程序挂掉。现如今网络上有很多图片库,如 Universal-Image-Loader,Picasso,FrescoGlide等等。相信列举出的这几个库大家都不陌生,这也是目前最火的图片库了。由于个人的喜好原因(主要是别人介绍说Glide库比较NB),所以就开始研究学习Glide。

Glide库和Picasso库有极大的相似性,编码风格也几近相同,不过Glide缺有着更为强大的功能。它在缓存处理方面有着很大的优势并且支持加载Gif动画以及本地Video。这个库在谷歌开源库中也有应用。如此好东西,心动不如行动,现在开始我们的学习之旅吧。


源码【传送门】


配置

使用Glide的第一步是现在我们的builde.gradle

dependencies {
  compile 'com.github.bumptech.glide:glide:3.7.0'
  compile 'com.android.support:support-v4:19.1.0'
}
  • 		1
  • 2
  • 3
  • 4

配置gradle文件后,我们就可以使用Glide了。上代码

Glide.with(context).load("http://img2.3lian.com/2014/f6/173/d/51.jpg").into(imageView);
  • 		1

看着很简单吧,一句话就可以实现图片下载和展示。我们看到Glide使用建造者模式加载图片。

RequestManager with(Context context)
RequestManager with(Activity activity)
RequestManager with(FragmentActivity activity)
  • 		1
  • 2
  • 3

我们看到with()可接受三种参数,这也是Glide的亮点,它能根据传入参数Activity/Fragment的生命周期保持一致,去暂停和执行图片加载,这也节省了不必要的流量浪费。

加载图片方式

DrawableTypeRequest<String> load(String string)
DrawableTypeRequest<Uri> load(Uri uri)
DrawableTypeRequest<File> load(File file)
DrawableTypeRequest<Integer> load(Integer resourceId)
DrawableTypeRequest<URL> load(URL url)
  • 		1
  • 2
  • 3
  • 4
  • 5
  • 6

String参数加载

Glide.with(this).load("http://img2.3lian.com/2014/f6/173/d/51.jpg").into(imageView);
  • 		1

资源文件加载

 int  resourceId=R.mipmap.image;
 Glide.with(context).load(resourceId).into(imageView);
  • 		1
  • 2

本地文件加载

File file = new File(Environment.getExternalStorageDirectory() + File.separator +  "image", "image.jpg");
Glide.with(this).load(file).into(imageView);
  • 		1
  • 2

Uri加载

File file = new File(Environment.getExternalStorageDirectory() + File.separator +  "image", "image.jpg");
Uri uri = Uri.fromFile(file);
Glide.with(this).load(uri).into(imageView);//uri加载方式
  • 		1
  • 2
  • 3

URL方式

该方式在源码中已经标记@Deprecated

        try {
           url=new URL("http://img2.3lian.com/2014/f6/173/d/51.jpg");
        } catch (MalformedURLException e) {
            e.printStackTrace();
        }
    Glide.with(this).load(url).into(imageView);//URL加载方式    
  • 		1
  • 2
  • 3
  • 4
  • 5
  • 6

设置占位图片

在上面的处理中,我们之间将加载成功的图片展示到ImageView,这样会不会看起来很突兀?是的,Glide为我们提供了设置占位符,他可以让我们知道图片是否加载成功,等

placeholder

我们都知道,图片加载是不确定的,加载成功需要的时间也是不确定的,而在加载这段时间,我们可以通过placeholder设置给ImageView一个占位符,图片上可以提示正在加载中之类的,当然可以任何你要的效果,

Glide.with(context).load("http://img2.3lian.com/2014/f6/173/d/55.jpg").placeholder(R.mipmap.place).into(imageView);
  • 		1

error

当然除了加载成功前我们设置了占位符,那么如果加载错误(网络原因及url非法原因等导致图片没有加载成功),我们填充一个图片到ImageView提示用户当前图片加载失败。

Glide.with(context).load("http://img2.3lian.com/2014/f6/173/d/55.jpg").error(R.mipmap.error).into(imageView);
  • 		1

此时你可能想如何知道图片加载失败的具体原因呢?Glide为我们提供了listener()方法,接收RequestListener对象

        //设置错误监听
         RequestListener<String,GlideDrawable> errorListener=new RequestListener<String, GlideDrawable>() {
            @Override
            public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {

                Log.e("onException",e.toString()+"  model:"+model+" isFirstResource: "+isFirstResource);
                imageView.setImageResource(R.mipmap.ic_launcher);
                return false;
            }

            @Override
            public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
                Log.e("onResourceReady","isFromMemoryCache:"+isFromMemoryCache+"  model:"+model+" isFirstResource: "+isFirstResource);
                return false;
            }
        } ;
  • 		1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16

我们看到有两个回调方法,通过onException是图片加载异常回调,onResourceReady是加载成功的回调。我们可以测试不同情况打印的日志

  • 正确的url首次加载
onResourceReady: isFromMemoryCache:false  model:http://img2.3lian.com/2014/f6/173/d/51.jpg isFirstResource: true
  • 		1
  • 正确的url第二次加载
onResourceReady: isFromMemoryCache:true  model:http://img2.3lian.com/2014/f6/173/d/51.jpg isFirstResource: true
  • 		1
  • 错误的url
onException: java.io.IOException: Request failed 404: Not Found  model:http://img2.3lian.com/2014/f6/173/d/511.jpg isFirstResource: true
  • 		1
  • 错误的url(非图片类型url)
onException: java.io.FileNotFoundException: No such file or directory  model:www.baidu.com isFirstResource: true
  • 		1
  • 无网络
onException: java.net.UnknownHostException: Unable to resolve host "img2.3lian.com": No address associated with hostname  model:http://img2.3lian.com/2014/f6/173/d/51.jpg isFirstResource: true
  • 		1

通过日志我们很容易看出异常的原因,因此,我们可以针对不同的操作情形,书写自己的处理给用户反馈。

crossFade

通过上面的分析,我们实现了占位图填充ImageView,但是我们依然发现其中有些不足,因为图片的转换并没有实现平滑过渡效果,实际新api已经默认实现一个渐入渐出的动画效果,默认是300ms.

Glide.with(context).load("http://img2.3lian.com/2014/f6/173/d/51.jpg").error(R.mipmap.error).placeholder(R.mipmap.place).crossFade().into(imageView);
  • 		1

crossFade()还可以接收一个int型的参数,用它来指定动画执行的时间,例如我们设置动画执行的时间是2s

Glide.with(context).load("http://img2.3lian.com/2014/f6/173/d/51.jpg").error(R.mipmap.error).placeholder(R.mipmap.place).crossFade(2000).into(imageView);
  • 		1

既然我们能添加一个渐入渐出的动画效果,那么如果想直接显示图片而没有任何淡入淡出效果,该作何处理,我们可以使用dontAnimate()方法,这是直接显示你的图片,而不是淡入显示到 ImageView。

图片调整

Glide加载图片大小是自动调整的,他根据ImageView的尺寸自动调整加载的图片大小,并且缓存的时候也是按图片大小缓存,每种尺寸都会保留一份缓存,如果图片不会自动适配到 ImageView,调用 override(horizontalSize, verticalSize) 。这将在图片显示到 ImageView之前重新改变图片大小

        //Glide返回首页] [打印] [返回上页]   下一篇