這個系列的前兩篇博客已經展示了如何去加載一張圖片到一個 ImageView中。這篇博客將會演示 ListView 和 GridView 的 adapter 中實現。每個單元格包含一個 ImageView。這有點類似于 很多圖片畫廊應用。 ? **畫廊實現示例：ListView?** 首先我們需要一些測試圖片。我們從我們的 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", }; ~~~ 其次，我們需要一個 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)); } } ~~~ 再次，看下 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`，并且填充設備的寬度。顯然，這不是最好的圖片畫廊，不過，不要在意這些細節。 在這之前，我們需要為 `ListView` 實現一個 [adapter](https://developer.android.com/reference/android/widget/Adapter.html?hl=zh-cn)。讓它看起來是簡單的，并綁定我們的 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 的額外能力（除了圖片加載和緩存）。即：下周將將會關注占位符和動畫。