Glide - 用 animate() 自定義動畫
來自： http://mrfu.me/2016/02/28/Glide_Custom_Animations_with_animate()/
上周，我們看了圖像在顯示之前做了轉換。這周我們用動畫選項來顯示圖像。
Glide 系列預覽
- 開始！
- 加載進階
- ListAdapter(ListView, GridView)
- 占位符 和 漸現動畫
- 圖片重設大小 和 縮放
- 顯示 Gif 和 Video
- 緩存基礎
- 請求優先級
- 縮略圖
- 回調：SimpleTarget 和 ViewTarget 用于自定義視圖類
- 加載圖片到通知欄和應用小部件中
- 異常：調試和錯誤處理
- 自定義轉換
- 用 animate() 自定義動畫
- 集成網絡棧
- 用 Module 自定義 Glide
- Module 實例：接受自簽名證書的 HTTPS
- Module 實例：自定義緩存
- Module 實例：用自定義尺寸優化加載的圖片
- 動態使用 Model Loader
- 如何旋轉圖像
- 系列綜述
動畫基礎
從圖像到圖像的平滑過渡是非常重要的。用戶不喜歡在應用中出現突然的轉變。這就是 Glide 要做的。Glide 中有一個標準動畫去柔軟的在你的 UI 中改變。我們在 之前的博客 看了 .crossFade() 。
但是這篇博客，我們要去看看除了 .crossFade() 的其他選擇。Glide 提供了兩個選項去設置一個動畫。兩個版本都是在 animate() 中，但傳的參數并不同。
在我們之前代碼，我們指出，動畫僅僅用于不從緩存中加載的情況。如果圖片被緩存過了，它的顯示是非常快的，因此動畫是沒有必要的，并且不顯示的。
從資源中的動畫
回到代碼，第一個選項是傳一個 Android 資源 id，即動畫的資源。一個簡單的例子是每個 Android 系統都提供的：slide-in-left(從左滑入)動畫， android.R.anim.slide_in_left 。下面這段代碼是這個動畫的 XML 描述：
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="-50%p" android:toXDelta="0"
android:duration="@android:integer/config_mediumAnimTime"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0"
android:duration="@android:integer/config_mediumAnimTime" />
</set>
當然你可以創建你自己的 XML 動畫。比如一個小的縮放動畫，圖片剛開始小的，然后逐漸增大到原尺寸。
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<scale
android:duration="@android:integer/config_longAnimTime"
android:fromXScale="0.1"
android:fromYScale="0.1"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="1"
android:toYScale="1"/>
</set>
這兩個動畫都可以用到 Glide 建造者中：
Glide
.with( context )
.load( eatFoodyImages[0] )
.animate( android.R.anim.slide_in_left ) // or R.anim.zoom_in
.into( imageView1 );
在圖片從網絡加載完并準備好之后將從左邊滑入。
通過自定義類實現動畫
當你想加載到常規的 ImageView 中這是沒問題的。但是如果 target 是一些自定義的呢，比如我們之前在 這篇博客 里所談論過的？所以另外一個選項就非常有用了。通過傳遞一個動畫資源的引用，你實現的一個類有 ViewPropertyAnimation.Animator 接口。
這個很簡單，你只需實現 void animate(View view) 方法。這個視圖對象是整個 target 視圖。如果它是一個自定義的視圖，你要找到你的視圖的子元素，并且做些必要的動畫。
來看個簡單的例子。假設你想要實現一個漸現動畫，你得需要創建這樣的動畫對象：
ViewPropertyAnimation.Animator animationObject = new ViewPropertyAnimation.Animator() {
@Override
public void animate(View view) {
// if it's a custom view class, cast it here
// then find subviews and do the animations
// here, we just use the entire view for the fade animation
view.setAlpha( 0f );
ObjectAnimator fadeAnim = ObjectAnimator.ofFloat( view, "alpha", 0f, 1f );
fadeAnim.setDuration( 2500 );
fadeAnim.start();
}
};
接下來，你需要在 Glide 請求中去設置這個動畫：
Glide
.with( context )
.load( eatFoodyImages[1] )
.animate( animationObject )
.into( imageView2 );
當然，在 animate(View view) 中你的動畫對象方法中， 你可以做任何你想要對視圖做的事情。自由的用你的動畫創建吧。
如果你要在你的自定義視圖中實現，你只需要創建這個視圖對象，然后在你的自定義視圖中創建你的自定義方法。
Summary
這篇博客中，你已經學會了如何為你的 Glide 請求去創建和應用標準的和自定義的動畫。這是我們圍繞的話題中的一個，它是非常有益的。我們推薦你花費一些時間去對我們上面的代碼進行測試，胡總去實現你自己的想法吧。你可以在評論中讓我們知道！
下次，我們要開始解決最后一個 Glide 的大話題：自定義 Glide！具體而言，下周我們會介紹如何在 Glide 中整合各種網絡棧。
</div>