http://mrfu.me/2016/02/27/Glide_Advanced_Loading/
Glide不仅能从一个网络 URL 中加载, 也能从 Android 资源,文件和 Uri 中加载图片
第一次:从一个 URL 中加载图片
就像 Picasso, Glide 库是使用流接口(fluent interface)。对一个完整的功能请求,Glide 建造者要求最少有三个参数。
with(Context context)
- 对于很多 Android API 调用,Context 是必须的。Glide 在这里也一样load(String imageUrl)
- 这里你可以指定哪个图片应该被加载,同上它会是一个字符串的形式表示一个网络图片的 URLinto(ImageView targetImageView)
你的图片会显示到对应的 ImageView 中。
理论解释总是苍白的,所以,看一下实际的例子吧:
ImageView targetImageView = (ImageView) findViewById(R.id.imageView);
String internetUrl = "http://i.imgur.com/DvpvklR.png";
Glide
.with(context)
.load(internetUrl)
.into(targetImageView);
就这样!如果图片的 URL 存在并且你的 ImageView 是可见的,你会在几秒后看到图片。万一图片不存在,Glide 会返回一个错误的回调(我们会在后面讨论这个)。你可能已经相信这三行代码对你而言是有用的,但是这只是冰山一角啦。
从资源中加载
首先从Android 资源中加载,使用一个资源 id (int),来替换之前使用字符串去指明一个网络 URL 的情况。
int resourceId = R.mipmap.ic_launcher;
Glide
.with(context)
.load(resourceId)
.into(imageViewResource);
如果你对于 R.mipmap 有困惑,这是 Android 处理 icon 的新方式。
当然,你可以直接为 ImageView 类去设置资源。然而,如果你用的高级话题如动态转换来说,这可能是比较有趣的。
从文件中加载
其次是从文件中加载,当你让用户选择一张照片去显示图像(比如画廊)这可能会比较有用。该参数只是一个文件对象。我们看一个例子:
//这个文件可能不存在于你的设备中。然而你可以用任何文件路径,去指定一个图片路径。
File file = new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_PICTURES), "Running.jpg");
Glide
.with(context)
.load(file)
.into(imageViewFile);
从 Uri 中加载
最后,你也指定一个 Uri 来加载图片。该请求和之前的没有什么不同。
//这可能是任何 Uri。为了演示的目的我们只是用一个 launcher icon 去创建了一个 Uri
Uri uri = resourceIdToUri(context, R.mipmap.future_studio_launcher);
Glide
.with(context)
.load(uri)
.into(imageViewUri);
一个小助手功能:简单的从资源 id 转换成 Uri。
public static final String ANDROID_RESOURCE = "android.resource://";
public static final String FOREWARD_SLASH = "/";
private static Uri resourceIdToUri(Context context, int resourceId) {
return Uri.parse(ANDROID_RESOURCE + context.getPackageName() + FOREWARD_SLASH + resourceId);
}
然而, Uri 不必从资源中去生成,它可以是任何 Uri。
简单的示例:
画廊实现示例:ListView
1、我们需要一些测试图片。我们从我们的 eatfoody.com 项目中去拿了一些图片。
public static String[] eatFoodyImages = {
"http://i.imgur.com/rFLNqWI.jpg",
"http://i.imgur.com/C9pBVt7.jpg",
"http://i.imgur.com/rT5vXE1.jpg",
"http://i.imgur.com/aIy5R2k.jpg",
"http://i.imgur.com/MoJs9pT.jpg",
"http://i.imgur.com/S963yEM.jpg",
"http://i.imgur.com/rLR2cyc.jpg",
"http://i.imgur.com/SEPdUIx.jpg",
"http://i.imgur.com/aC9OjaM.jpg",
"http://i.imgur.com/76Jfv9b.jpg",
"http://i.imgur.com/fUX7EIB.jpg",
"http://i.imgur.com/syELajx.jpg",
"http://i.imgur.com/COzBnru.jpg",
"http://i.imgur.com/Z3QjilA.jpg",
};
2、我们需要一个 activity,它创建一个 adapter 并设置给一个 ListView。
public class UsageExampleAdapter extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_usage_example_adapter);
listView.setAdapter(new ImageListAdapter(UsageExampleAdapter.this, eatFoodyImages));
}
}
3、看下 adapter 的布局文件。这个 ListView 的 item 的布局文件是非常简单的。
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="200dp"/>
这回显示一个图片列表,每个的高度是 200dp,并且填充设备的宽度。显然,这不是最好的图片画廊,不过,不要在意这些细节。
4、我们需要为 ListView 实现一个 adapter。让它看起来是简单的,并绑定我们的 eatfoody 样本图片到 adapter。每个 item 会显示一个图片。
public class ImageListAdapter extends ArrayAdapter {
private Context context;
private LayoutInflater inflater;
private String[] imageUrls;
public ImageListAdapter(Context context, String[] imageUrls) {
super(context, R.layout.listview_item_image, imageUrls);
this.context = context;
this.imageUrls = imageUrls;
inflater = LayoutInflater.from(context);
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
if (null == convertView) {
convertView = inflater.inflate(R.layout.listview_item_image, parent, false);
}
Glide
.with(context)
.load(imageUrls[position])
.into((ImageView) convertView);
return convertView;
}
}
有趣的事情发生在 ImageListAdapter 类里的 getView() 方法中。你会看到 Glide 调用方式和之前的’常规’加载图片的方式是完全一样的。不管你在应用中想要如何去加载,Glide 的使用方式总是一样的。
作为一个进阶的 Android 开发者你需要知道我们需要去重用 ListView 的布局,去创建一个快速又顺滑滚动的体验。Glide 的魅力是自动处理请求的取消,清楚 ImageView,并加载正确的图片到对应的 ImageView。
Glide 的一个优势:缓存
当你上下滚动很多次,你会看到图片显示的之前的快的多。在比较新的手机上,这甚至都不需要时间去等。你可以会猜测,这些图片可能是来自缓存,而不再是从网络中请求。Glide 的缓存实现是基于 Picasso,这对你来说会更加全面的而且做很多事情会更加容易。缓存实现的大小是依赖于设备的磁盘大小。
当加载图片时,Glide 使用3个来源:内存,磁盘和网络(从最快到最慢排序)。再说一次,这里你不需要做任何事情。Glide 帮你隐藏了所有复杂的情况,同时为你创建了一个智能的缓存大小。我们将在以后的博客中去了解这块缓存知识。
画廊实现示例:GridView
对于 GridView 来说这和 ListView 的实现并没有什么不同,你实际上可以用相同的 adapter,只需要在 activity 的布局文件改成 GridView:
<?xml version="1.0" encoding="utf-8"?>
<GridView
android:id="@+id/usage_example_gridview"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:numColumns="2"/>
其他应用:ImageView 作为元素
目前为止,我们仅仅看了整个 adapter 的 item 是一个 ImageView。该方法仍然应用于一个或者多个 ImageView 作为 adapter item 的一部分的情况。你的 getView() 代码会有一点不同,但是 Glide 项的加载方式是完全相同的。
展望
在此,恭喜你已经学会如何用 Glide 加载图片的 90%的 Android 使用场景了。在我们覆盖额外的案例之前,我们需要解释 Glide 的更有趣的能力(除了图片加载和缓存)。即:下周将将会关注占位符和动画。