Android App中使用Glide加载图片的教程
作者:倾城_之泪
与其他图片加载库相同,Glide除了可以加载网络图片之外,也可以加载本地图片。甚至还可以从各种各样奇葩的数据源中加载图片。
加载网络图片
很多情况下,我们使用图片加载库就是为了加载网络图片。网络操作是一个很复杂的东西。试想一下,如果没有图片加载库,我们就要手动去下载图片,缓存图片,最后再从文件里面读取bitmap并设置到Imageview里面。这还算好的,要是在Listview里面你会更头疼的。原因我就不说了,你懂的~~再加上各种各样的Bitmap操作,保准你再也不想撸代码了。而且Bitmap这东西还很占内存,伺候不好,很容易就会引发OOM,app吧唧就闪退了!!
图片加载库的优势就在于此。简简单单一句话,下载,缓存,加载统统搞定。简直就是美好一生的东西。而Glide就是这样使人美好一生的东西之一。
说了这么多,Glide如何加载网络图片?很简单,就上次的三句话:
ImageView targetImageView = (ImageView) findViewById(R.id.imageView); String internetUrl = "http://i.imgur.com/idojSYm.png"; Glide .with(context) .load(internetUrl) .into(targetImageView);
木有什么乱七八糟的东西,直接传入要加载图片的url就可以了。那么图片加载库有很多,为什么选择Glide呢?很简单,因为它流畅,不卡,尤其是在Listview中。嗯,就是酱~
加载本地图片
下表是.load()可以传入的参数及说明
参数 | 说明 |
---|---|
.load(String string) | string可以为一个文件路径、uri或者url |
.load(Uri uri) | uri类型 |
.load(File file) | 文件 |
.load(Integer resourceId) | 资源Id,R.drawable.xxx或者R.mipmap.xxx |
.load(byte[] model) | byte[]类型 |
.load(T model) | 自定义类型 |
从上面可以看到Glide不仅可以加载网络图片,还可以加载本地图片。可接受的参数有文件路径,uri,文件,资源id等。基本上满足了大部分的需求。虽然加载本地图片不像网络图片那样复杂,但我还是建议使用Glide来加载本地图片。因为它是内存友好的,而且还会“偷偷地”帮我们做很多事情。比如内存缓存,Bitmap复用,修正照片方向等。当然为了满足各种各样的需求,仅仅加载图片是不够的,你还需要对图片进行各种各样的变换,也就是Transformation。后面我们会详细了解的。
加载自定义数据源
前面的表格中有一个是我们不熟悉的,就是.load(T model),即自定义的数据源类型。那么如何去实现呢?
实际上,加载自定义数据源主要是通过ModelLoader接口来实现的。由于没有在实际项目中用到过,这方面的经验比较少。
不过从官方Wiki上来看,设计ModelLoader接口的初衷用来加载不同尺寸的图片的。众所周知,Android设备屏幕分辨率千奇百怪,大到2K,小到320p。如果在低分辨率的手机上加载大图,不仅损耗用户流量,而且很容易造成OOM;在高分辨的手机上,加载小图又会出现模糊的情况,用户体验极差。很多时候,为了省事,很多app都会选择一个中间分辨率,然后自适应大小。当然这样做无可厚非,但是有更好的办法,我们为什么不去尝试呢?
那么如何使用Glide来实现这一具体需求呢?首先你要实现自己的ModelLoader,比较简单的方法是继承BaseGlideUrlLoader。
public interface MyDataModel { public String buildUrl(int width, int height); } public class MyUrlLoader extends BaseGlideUrlLoader<MyDataModel> { @Override protected String getUrl(MyDataModel model, int width, int height) { // Construct the url for the correct size here. return model.buildUrl(width, height); } }
接下来我们可以这样来加载图片:
Glide.with(this) .using(new MyUrlLoader(this)) .load(new MyDataModel() { @Override public String buidUrl(int width, int height) { if (width >= 600) { return url1; } else { return url2; } } }) .into(imageView);
(1).using(new MyUrlLoader(this)):使用我们自己的ModeLoader;
(2).load(new MyDataModel()):加载我们自定义的数据源
这里需要解释下getUrl的三个参数:
(1)model:你加载的数据源
(2)width:你加载的图片的宽度(px)
(3)height:你加载的图片的高度(px)
这样,我们在高分率的设备上加载大图的url1,在低分辨率的设备上加载小图url2。从而实现了根据不同手机上的像素值大小加载不同尺寸的图片的需求。
当然如果你不想每次都是用.using(new MyUrlLoader()),就需要实现一个自定义的ModelLoaderFactory并在GlideModule中注册。
public class MyGlideModule implements GlideModule { ... @Override public void registerComponents(Context context, Glide glide) { glide.register(MyDataModel.class, InputStream.class, new MyUrlLoader.Factory()); } }
同时也要在AndroidManifest.xml声明
<meta-data android:name="com.mypackage.MyGlideModule" android:value="GlideModule" />
如果你有多个自定义的GlideModule类,那么也要在AndroidManifest.xml中声明多个GlideModule。
在服务端有下面的几个可以加载的url:
URL | 图片大小 |
---|---|
myserver.com/images/__w-200-400-600-800-1000__/session1.jpg | 原始尺寸 |
myserver.com/images/w200/session1.jpg | 200px |
myserver.com/images/w400/session1.jpg | 400px |
myserver.com/images/w600/session1.jpg | 600px |
myserver.com/images/w800/session1.jpg | 800px |
myserver.com/images/w1000/session1.jpg | 1000px |
那么客户端如何根据不同的手机分辨率去加载不同的url呢?
Google是这样做的,下面是核心代码:
//定义正则表达式 private static final Pattern PATTERN = Pattern.compile("__w-((?:-?\\d+)+)__"); @Override protected String getUrl(String model, int width, int height) { Matcher m = PATTERN.matcher(model); int bestBucket = 0; if (m.find()) { String[] found = m.group(1).split("-");//拿到可以加载的尺寸数组 for (String bucketStr : found) { bestBucket = Integer.parseInt(bucketStr); if (bestBucket >= width) {//刚好大于要加载的尺寸,直接跳出循环 // the best bucket is the first immediately // bigger than the requested width break; } } if (bestBucket > 0) {//返回合适尺寸的url model = m.replaceFirst("w"+bestBucket); } } return model; }
大概的步骤如下:
1.根据服务端可加载的图片url定义正则表达式
2.根据正则匹配,获取到可以加载的图片尺寸数组
3.根据要加载的Imageview的大小,选择合适的尺寸的url
4.拼接url并返回
上面的例子中有200,400,600,800,1000是可以加载的,如果你要加载的Imageview的大小为600px,当遍历数组到600时,就会直接跳出循环,返回600px大小图片的url,Glide就会加载600px的图片。
异常调试
在Glide加载图片过程中出现异常时,默认是没有log输出的。但是Glide给开发者提供了两种方法来查看或者响应这些异常。
1.调试
为了在异常发生时可以看到它们,你可以打开Glide中处理所有媒体加载响应的类GenericRequest的log开关。很简单,在命令行运行下面的指令即可:
adb shell setprop log.tag.GenericRequest DEBUG
如果你将DEBUG替换为VERBOSE,还可以看到详细的请求时间日志。
如果你想禁用log输出,执行:
adb shell setprop log.tag.GenericRequest ERROR
2.调试工作流
为了查看Glide内部引擎是何时、如何加载图片的,你可以启用这些log:
adb shell setprop log.tag.Engine VERBOSE adb shell setprop log.tag.EngineJob VERBOSE adb shell setprop log.tag.DecodeJob VERBOSE
启用这些log可以帮助你了解到为什么某些资源没有从内存中加载?为什么从外部url加载要重新下载数据?同时这也有助于了解在磁盘缓存时哪些参数需要配置。启用DecodeJob log还可以帮助你了解自定义变换/解码器/编码器等相关问题。
3.请求监听器
虽然启动调试日志很简单,但前提是你可以访问到设备。为了完善Glide已存在或更复杂的错误日志系统,你可以使用RequestListener类。当加载请求失败时onException()方法就会被调用,并给出造成失败的异常或者null(在解码器无法从它获取到的数据中解码出任何有用的东西时)。你可以通过listener() API为每一个请求添加一个监听器。
确保onException()方法的返回值为false,避免覆盖Glide默认的错误处理(比如加载失败的错误图片占位)。
这里有一个实现快速调试的列子:
// 示例: .listener(new LoggingListener<String, GlideDrawable>()) public class LoggingListener<T, R> implements RequestListener<T, R> { @Override public boolean onException(Exception e, Object model, Target target, boolean isFirstResource) { android.util.Log.d("GLIDE", String.format(Locale.ROOT, "onException(%s, %s, %s, %s)", e, model, target, isFirstResource), e); return false; } @Override public boolean onResourceReady(Object resource, Object model, Target target, boolean isFromMemoryCache, boolean isFirstResource) { android.util.Log.d("GLIDE", String.format(Locale.ROOT, "onResourceReady(%s, %s, %s, %s, %s)", resource, model, target, isFromMemoryCache, isFirstResource)); return false; } }