Glide — 占位圖 & 漸變動畫
原文：Placeholders & Fade Animations
作者：Norman Peitek
翻譯：Dexter0218
在學習了如何從各種圖片源中加載圖片后，這節將要學習占位圖——在實際圖片加載完成前預加載的圖片。
Glide 系列概覽
- 入門簡介
- 高級加載
- 適配器(ListView, GridView)
- 占位圖& 淡入淡出動畫
- 圖片大小 & 縮放
- 播放GIF & 視頻
- 緩存基礎
- 請求優先級
- 縮略圖
- 回調：定制view中使用SimpleTarget和ViewTarget
- 通知欄和桌面小控件的圖片加載
- 異常: 調試和報錯處理
- 自定義變換
- 用animate()定制動畫
- 整合網絡協議棧
- 用Modules定制Glide
- Glide Module 案例: 接受自簽名HTTPS證書
- Glide Module 案例: 自定義緩存
- Glide Module 案例: 通過加載自定義大小圖片優化
- 動態使用 Model Loaders
- 如何旋轉圖片
- 系列綜述
我們根本沒有必要討論或解釋：空白的ImageView在任何UI中看起來都是丑陋的。如果你在使用Glide，你很可能正在從網絡上加載圖片。假如你網絡的環境不好，加載過程可能需要花費大量的時間。這時候就需要一個占位圖先顯示出來，直到實際的圖片加載并處理完畢。
Glide的流接口讓這個工作變得很簡單！只要調用.placeHolder() ，并傳遞進去一個圖片資源，Glide會顯示那個占位圖，直到實際圖片準備完畢。
Glide
.with(context)
.load(UsageExampleListViewAdapter.eatFoodyImages[0])
.placeholder(R.mipmap.ic_launcher) // can also be a drawable
.into(imageViewPlaceholder);
顯然，你不能設置一個網絡的url當作占位圖。假如那樣，占位圖也需要時間去下載。App內的資源和圖片毫無疑問是可以使用的。同時，由于Glide的load()可以接受各式的參數，這些參數可能是不能加載的（無網絡連接，服務器掛了，等等），被刪除的或者其他無法訪問的。在下一節，我們會介紹出錯占位圖。
出錯占位圖: .error()
我們假設我們的app嘗試從網頁加載一張圖片，但網頁不可訪問，Glide會給我們選項去進行出錯的回調，并采取合適的行動。（選項問題以后再討論，目前來說還是比較復雜的）。在大多數情況下，占位圖可以完全足夠用來表明圖片無法加載。
跟之前栗子中預加載的占位圖一樣，調用Glide的流接口即可，只是有命名上有點不一樣，叫error()：
Glide
.with(context)
.load("http://futurestud.io/non_existing_image.png")
.placeholder(R.mipmap.ic_launcher) // can also be a drawable
.error(R.mipmap.future_studio_launcher) // will be displayed if the image cannot be loaded
.into(imageViewError);
上面的代碼中，如果從load()里傳入的圖片無法被加載，Glide會顯示R.mipmap.future_studio_launcher來代替。再次強調一下，error()可以接受的只能是已經被初始化的圖片資源或者指向圖片資源的id(R.drawable.<drawable-keyword>)。
crossFade()的使用
無論你是否使用占位圖，對于UI來說，圖片的改變是相當大的一個動作。一個簡單的方法可以讓這個變化更平滑，更讓人眼接受，這就是使用crossfade動畫。Glide支持標準的crossfade動畫，（對于目前版本3.6.1）是默認可用的。如果你想要使用crossfade動畫，你只要在在構造器里添加另外一個調用：
Glide
.with(context)
.load(UsageExampleListViewAdapter.eatFoodyImages[0])
.placeholder(R.mipmap.ic_launcher) // can also be a drawable
.error(R.mipmap.future_studio_launcher) // will be displayed if the image cannot be loaded
.crossFade()
.into(imageViewFade);
crossFade()方法有另外一個特征：.crossFade(int duration),如果你想要減慢（或加快）動畫，隨便傳入一個毫秒級的時間進去感受一下。默認的動畫時間是300毫秒。
dontAnimate()的使用
如果你只是直接顯示圖片，而不需要crossfade效果，那就在Glide的請求構造里調用.dontAnimate()：
Glide
.with(context)
.load(UsageExampleListViewAdapter.eatFoodyImages[0])
.placeholder(R.mipmap.ic_launcher) // can also be a drawable
.error(R.mipmap.future_studio_launcher) // will be displayed if the image cannot be loaded
.dontAnimate()
.into(imageViewFade);
你會直接看到圖片，沒有漸入的過程。請你確認你有自己的理由要這么做。
提醒你個很重要的事，這些參數都是獨立的，并且設置不依賴彼此。例如，你可以只設置.error()，而不用調用.placeholder()。你可以設置crossFade()動畫，而不用設置占位圖。參數的任意結合都是可行的。
展望
很希望你能從這篇文章中理解并學到許多。圖片的意外顯示對于用戶體驗來說是相當糟糕的。另外，當出錯的時候，用明顯的方式告訴用戶。Glide幫助你用簡單的方法調用這些功能，讓你的app體驗更出色。
但是，我們還沒有結束我們的優化。后續，我們會學習圖片大小的調整和縮放。
