Glide — 自定義變換

原文：Custom Transformation
作者：Norman Peitek
翻譯：Dexter0218

前面的12篇文章中，你已經(jīng)學(xué)會了所有的基礎(chǔ)請求去實現(xiàn)Glide的標(biāo)準(zhǔn)功能。從這篇文章開始，我們將要深入研究一些高級話題。這篇文章進(jìn)一步研究變換（Transformations）。

Glide 系列概覽

1. 入門簡介
2. 高級加載
3. 適配器(ListView, GridView)
4. 占位圖& 淡入淡出動畫
5. 圖片大小 & 縮放
6. 播放GIF & 視頻
7. 緩存基礎(chǔ)
8. 請求優(yōu)先級
9. 縮略圖
10. 回調(diào)：定制view中使用SimpleTarget和ViewTarget
11. 通知欄和桌面小控件的圖片加載
12. 異常: 調(diào)試和報錯處理
13. 自定義變換
14. 用animate()定制動畫
15. 整合網(wǎng)絡(luò)協(xié)議棧
16. 用Modules定制Glide
17. Glide Module 案例: 接受自簽名HTTPS證書
18. Glide Module 案例: 自定義緩存
19. Glide Module 案例: 通過加載自定義大小圖片優(yōu)化
20. 動態(tài)使用 Model Loaders
21. 如何旋轉(zhuǎn)圖片
22. 系列綜述

變換

在圖片顯示出之前可以對圖片進(jìn)行變換處理。例如，如果你的app需要顯示一張灰度圖，但只能獲取到一個原始全色彩的版本，你可以使用一個變換去將圖片從有明艷色彩的版本轉(zhuǎn)換成慘淡的黑白版。不要誤會我們，變換不僅限于顏色。你可以改變圖片的很多屬性：大小、邊框、色彩、像素點，等等！在之前介紹用Glide調(diào)整圖片大小時，已經(jīng)介紹了自帶的兩個變換fitCenter和 centerCrop。這兩個方案都有一個顯著的特征，他們有他們自己的Glide轉(zhuǎn)換方法，所以，這篇文章不再介紹了。

實現(xiàn)你自己的變換

為了實現(xiàn)你自己自定義的變換，你需要創(chuàng)建一個新的類去實現(xiàn)變換接口。這個方法需要實現(xiàn)的內(nèi)容還是相當(dāng)復(fù)雜的，你需要深入探索Glide的內(nèi)部結(jié)構(gòu)才能讓其工作好。如果你只是想要常規(guī)的圖片（不包括Gif和視頻）變換，我們建議只要處理抽象的BitmapTransformation類。它簡化了相當(dāng)多的實現(xiàn)，能覆蓋95%的使用范圍。

所以，讓我們先看一下BitmapTransformation實現(xiàn)的一個例子。如果你有規(guī)律地看我們的文章，你知道我們最喜歡的變換是用Renderscript去模糊圖片。我們可以用之前用過的代碼去實現(xiàn)一個Glide變換。我們的框架必須繼承BitmapTransformation類：

public class BlurTransformation extends BitmapTransformation {

    public BlurTransformation(Context context) {
        super( context );
    }

    @Override
    protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) {
        return null; // todo
    }

    @Override
    public String getId() {
        return null; // todo
    }
}

現(xiàn)在，我們用前面文章的代碼，借助Renderscript來實現(xiàn)圖片的模糊處理。

public class BlurTransformation extends BitmapTransformation {

    private RenderScript rs;

    public BlurTransformation(Context context) {
        super( context );

        rs = RenderScript.create( context );
    }

    @Override
    protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) {
        Bitmap blurredBitmap = toTransform.copy( Bitmap.Config.ARGB_8888, true );

        // Allocate memory for Renderscript to work with
        Allocation input = Allocation.createFromBitmap(
            rs, 
            blurredBitmap, 
            Allocation.MipmapControl.MIPMAP_FULL, 
            Allocation.USAGE_SHARED
        );
        Allocation output = Allocation.createTyped(rs, input.getType());

        // Load up an instance of the specific script that we want to use.
        ScriptIntrinsicBlur script = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs));
        script.setInput(input);

        // Set the blur radius
        script.setRadius(10);

        // Start the ScriptIntrinisicBlur
        script.forEach(output);

        // Copy the output to the blurred bitmap
        output.copyTo(blurredBitmap);

        toTransform.recycle();

        return blurredBitmap;
    }

    @Override
    public String getId() {
        return "blur";
    }
}

再次提醒，如果你對transform()里的代碼困惑，建議看看之前的文章。getId()方法為這個變換描述了一個獨有的識別。Glide使用那個關(guān)鍵字作為緩存系統(tǒng)的一部分。防止出現(xiàn)異常問題，確保其唯一。

下一節(jié)，我們要學(xué)習(xí)如何應(yīng)用我們創(chuàng)建的變換方法。

應(yīng)用一個簡單的變換

Glide has two ways of applying a transformation. The first is to pass an instance of your class as a parameter to .transform(). You can apply any transformation there, no matter if it's for an image or Gif. The other option is to use .bitmapTransform(), which only accepts transformations for bitmaps. Since our implementation above is designed for bitmaps, we could use either one:

Glide有兩個不同的方式進(jìn)行變換。第一個是傳遞一個你的類的實例作為.transform()的參數(shù)。不管是圖片還是gif，都可以進(jìn)行變換。另一個則是使用.bitmapTransform()，它只接受bitmap的變換。由于我們的實現(xiàn)都是基于bitmap，我們可以使用第一個：

Glide  
    .with( context )
    .load( eatFoodyImages[0] )
    .transform( new BlurTransformation( context ) )
    //.bitmapTransform( new BlurTransformation( context ) ) // this would work too!
    .into( imageView1 );

這足夠讓Glide從網(wǎng)絡(luò)下載的圖片自動實現(xiàn)模糊算法。非常有用！

實現(xiàn)多重變換

通常，Glide的流接口（fluent interface）允許方法被連接在一起，然而變換并不是這樣的。確保你只調(diào)用.transform()或者.bitmapTransform()一次，不然，之前的設(shè)置將會被覆蓋！然而，你可以通過傳遞多個轉(zhuǎn)換對象當(dāng)作參數(shù)到.transform()（或者.bitmapTransform()）中來進(jìn)行多重變換：

Glide  
    .with( context )
    .load( eatFoodyImages[1] )
    .transform( new GreyscaleTransformation( context ), new BlurTransformation( context ) )
    .into( imageView2 );

在這段代碼中，我們先對圖片進(jìn)行了灰度變換，然后模糊處理。Glide會為你自動進(jìn)行兩個轉(zhuǎn)換。牛逼吧！

提示：當(dāng)你使用變換的時候，你不能使用.centerCrop()或者.fitCenter()。

Glide的變換集合

如果你已經(jīng)對你的app里要用什么變換有了想法，在花點時間看看下面的庫吧：Glide-transformations。它提供了許多變換的集合。值得去看一下你的idea是否已經(jīng)被實現(xiàn)了。

這個庫有2個不同版本。擴展庫包括更多的變換，并且是用手機的GPU進(jìn)行計算。需要一個額外的依賴，所以這兩個版本的設(shè)置還有點不一樣。你應(yīng)當(dāng)看看支持的變換的列表，再決定你需要用哪個版本。

Glide變換的設(shè)置

設(shè)置是很簡單的！對于基本版，你可以在你的build.gradle里加一行：

dependencies {  
    compile 'jp.wasabeef:glide-transformations:2.0.0'
}

如果你想要使用GPU變換：

repositories {  
    jcenter()
    mavenCentral()
}

dependencies {  
    compile 'jp.wasabeef:glide-transformations:2.0.0'
    compile 'jp.co.cyberagent.android.gpuimage:gpuimage-library:1.3.0'
}

Glide變換的使用

在你同步了Android Studio的builde.gradle文件后，你已經(jīng)可以進(jìn)行使用變換集合了。使用方式與使用自定義變換一樣。假如我們要用glide變換集合去模糊圖片：

Glide  
    .with( context )
    .load( eatFoodyImages[2] )
    .bitmapTransform( new jp.wasabeef.glide.transformations.BlurTransformation( context, 25 ) )
    .into( imageView3 );

你也可以像上面一樣應(yīng)用一組變換。一個單獨的變換或者一組變換，.bitmapTransform()都可以接受！

展望

這邊文章中，你已經(jīng)學(xué)會了Glide的一個非常有用的工具：變換。你已經(jīng)知道如何實現(xiàn)并應(yīng)用預(yù)定義的變換，我們希望這提供給你應(yīng)用到app里所有需要的幫助！如果你有問題，在評論區(qū)提出！

這篇文件講解了一個非常定制化的特征，后面的文章將介紹另一個：自定義動畫。