Glide谷歌官方推薦的圖片加載庫

聲明：非原創，轉載自http://blog.csdn.NET/Greathfs/article/details/52040658

安卓圖片加載一直都很煩人，畢竟內存就那麼一點，一不小心就oom了，好在有不少勤勞的大神門貢獻出來輪子給我們用，轉載了篇感覺不錯的glide使用介紹，我以前是比較習慣用imageloader的，不過既然是官方推薦肯定有優點的，這裏不追究原理了，只是教你怎麼使用。有能力的可以去網上找其他博客。轉載，轉載！

倘能生存，我當然仍要學習。

——— 魯迅

活到老，學到老，沒辦法，不學習跟不上節奏。走起吧。

簡介

Glide是 Google推薦的圖片加載庫,它可以支持來自url,Android資源,文件,Uri中的圖片加載,同時還支持gif圖片的加載,以及各種圖片顯示前的bitmap處理(例如:圓角圖片,圓形圖片,高斯模糊,旋轉,灰度等等),緩存處理,請求優先級處理,動畫處理,縮略圖處理,圖片大小自定義等等.可謂是非常的強大.

添加依賴

[html] view plain copy

compile 'com.github.bumptech.glide:glide:3.7.0'

加載網絡圖片

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        String url = "http://www.qq745.com/uploads/allimg/141106/1-141106153Q5.png";
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(url).
                asBitmap(). //強制處理爲bitmap
                into(targetView);//顯示到目標View中
    }
}

加載資源圖片

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        int resourceId = R.drawable.test;
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(resourceId).
                asBitmap().
                into(targetView);
    }
}

加載本地文件圖片

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        File file = new File(Environment.getExternalStorageDirectory(), "test.jpg");
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(file).
                asBitmap().
                into(targetView);
    }
}

從Uri中加載

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        Uri uri = Uri.parse("android.resource://" + this.getPackageName() + "/" + R.drawable.test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(uri).
                asBitmap().
                into(targetView);
    }
}

加載gif圖片

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(R.drawable.smail).
                asGif().//注意:這裏顯示的指明瞭要加載的是gif圖片,當然即使不指明,glide也會自己判斷.
                into(targetView);
    }
}

設置默認圖片和加載失敗時顯示的圖片

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(R.drawable.test).
                asBitmap().
                placeholder(R.drawable.bg_loading).//加載中顯示的圖片
                error(R.drawable.bg_error).//加載失敗時顯示的圖片
                into(targetView);
    }
}

淡入顯示效果

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(R.drawable.test).
                placeholder(R.drawable.bg_loading).//加載中顯示的圖片
                error(R.drawable.bg_error).//加載失敗時顯示的圖片
                crossFade().//淡入顯示,注意:如果設置了這個,則必須要去掉asBitmap
                into(targetView);
    }
}

另外,crossFade還可以接收一個參數來設置淡入顯示效果的持續時間,crossFade(int duration); 
如果你想直接顯示圖片,而不是淡入顯示圖片,則可以通過dontAnimate()方法設置.

調整圖片像素大小

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(R.drawable.test).
                placeholder(R.drawable.bg_loading).//加載中顯示的圖片
                error(R.drawable.bg_error).//加載失敗時顯示的圖片
                crossFade(1000).//淡入顯示的時間,注意:如果設置了這個,則必須要去掉asBitmap
                override(80,80).//設置最終顯示的圖片像素爲80*80,注意:這個是像素,而不是控件的寬高
                into(targetView);
    }
}

設置CenterCrop,FitCenter

CenterCrop,FitCenter都是對目標圖片進行裁剪,瞭解過ImageView的ScaleType屬性就知道,這2種裁剪方式在ImageView上也是有的,分別對應ImageView的ImageView.ScaleType.CENTER_CROP和mageView.ScaleType.FIT_CENTER的.

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        targetView.setScaleType(ImageView.ScaleType.FIT_CENTER);
        Glide.with(this).
                load(R.drawable.test).
                placeholder(R.drawable.bg_loading).//加載中顯示的圖片
                error(R.drawable.bg_error).//加載失敗時顯示的圖片
                crossFade(1000).//淡入淡出,注意:如果設置了這個,則必須要去掉asBitmap
                override(80,80).//設置最終顯示的圖片像素爲80*80,注意:這個是像素,而不是控件的寬高
                centerCrop().//中心裁剪,縮放填充至整個ImageView
                into(targetView);
    }
}

緩存策略設置

內存緩存設置,通過skipMemoryCache(boolean)來設置是否需要緩存到內存,默認是會緩存到內存的.

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        targetView.setScaleType(ImageView.ScaleType.FIT_CENTER);
        Glide.with(this).
                load(R.drawable.test).
                placeholder(R.drawable.bg_loading).//加載中顯示的圖片
                error(R.drawable.bg_error).//加載失敗時顯示的圖片
                crossFade(1000).//淡入淡出,注意:如果設置了這個,則必須要去掉asBitmap
                override(80,80).//設置最終顯示的圖片像素爲80*80,注意:這個是像素,而不是控件的寬高
                centerCrop().//中心裁剪,縮放填充至整個ImageView
                skipMemoryCache(true).//跳過內存緩存
                into(targetView);
    }
}

磁盤緩存,磁盤緩存通過diskCacheStrategy(DiskCacheStrategy)來設置,DiskCacheStrategy一共有4種模式:

DiskCacheStrategy.NONE:什麼都不緩存 
DiskCacheStrategy.SOURCE:僅緩存原圖(全分辨率的圖片) 
DiskCacheStrategy.RESULT:僅緩存最終的圖片,即修改了尺寸或者轉換後的圖片 
DiskCacheStrategy.ALL:緩存所有版本的圖片,默認模式

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        targetView.setScaleType(ImageView.ScaleType.FIT_CENTER);
        Glide.with(this).
                load(R.drawable.test).
                placeholder(R.drawable.bg_loading).//加載中顯示的圖片
                error(R.drawable.bg_error).//加載失敗時顯示的圖片
                crossFade(1000).//淡入淡出,注意:如果設置了這個,則必須要去掉asBitmap
                override(80, 80).//設置最終顯示的圖片像素爲80*80,注意:這個是像素,而不是控件的寬高
                centerCrop().//中心裁剪,縮放填充至整個ImageView
                skipMemoryCache(true).//跳過內存緩存
                diskCacheStrategy(DiskCacheStrategy.RESULT).//保存最終圖片
                into(targetView);
    }
}

緩存設置

在GlideModule 中,我們可以設置磁盤緩存的位置,磁盤緩存的大小和內存緩存的大小,同時還可以設置圖片的顯示質量.

要是用GlideModule ,需要創建它的實現類,然後在manifests中申明實現類的全類路徑:

[html] view plain copy

<meta-data
          android:name="com.example.greathfs.httputilsdemo.image.glide.module.SimpleGlideModule"
          android:value="GlideModule" />

GlideModule 的實現類,需要實現applyOptions方法:

[html] view plain copy

/**
 * 所以你知道要創建一個額外的類去定製 Glide。
 * 下一步是要全局的去聲明這個類，讓 Glide 知道它應該在哪裏被加載和使用。
 * Glide 會掃描 AndroidManifest.xml 爲 Glide module 的 meta 聲明。
 * 因此，你必須在 AndroidManifest.xml 的 <application> 標籤內去聲明這個SimpleGlideModule。
 * Created by mChenys on 2016/6/10.
 */
public class SimpleGlideModule implements GlideModule {
    public static DiskCache cache;

    @Override
    public void applyOptions(Context context, GlideBuilder builder) {
        // 在 Android 中有兩個主要的方法對圖片進行解碼：ARGB8888 和 RGB565。前者爲每個像素使用了 4 個字節，
        // 後者僅爲每個像素使用了 2 個字節。ARGB8888 的優勢是圖像質量更高以及能存儲一個 alpha 通道。
        // Picasso 使用 ARGB8888，Glide 默認使用低質量的 RGB565。
        // 對於 Glide 使用者來說：你使用 Glide module 方法去改變解碼規則。
        builder.setDecodeFormat(DecodeFormat.PREFER_ARGB_8888);
        //設置緩存目錄
        File cacheDir = PathUtils.getDiskCacheDir(context, CacheConfig.IMG_DIR);

        cache = DiskLruCacheWrapper.get(cacheDir, DiskCache.Factory.DEFAULT_DISK_CACHE_SIZE);// 250 MB
        builder.setDiskCache(new DiskCache.Factory() {
            @Override
            public DiskCache build() {
                return cache;
            }
        });
        //設置memory和Bitmap池的大小
        MemorySizeCalculator calculator = new MemorySizeCalculator(context);
        int defaultMemoryCacheSize = calculator.getMemoryCacheSize();
        int defaultBitmapPoolSize = calculator.getBitmapPoolSize();

        int customMemoryCacheSize = (int) (1.2 * defaultMemoryCacheSize);
        int customBitmapPoolSize = (int) (1.2 * defaultBitmapPoolSize);

        builder.setMemoryCache(new LruResourceCache(customMemoryCacheSize));
        builder.setBitmapPool(new LruBitmapPool(customBitmapPoolSize));
    }

    @Override
    public void registerComponents(Context context, Glide glide) {
    }
}

設置加載縮略圖

通過設置縮略圖,我們可以在顯示目標圖片之前先展示一個第分辨率或者其他圖片,當全分辨率的目標圖片在後臺加載完成後, 
Glide會自動切換顯示全像素的目標圖片.

設置縮略圖有2種方式: 
通過thumbnail(float)指定0.0f~1.0f的原始圖像大小,例如全像素的大小是500*500,如果設置爲thumbnail爲0.1f,即目標圖片的10%,顯示的縮略圖大小就是50*50;

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);

        Glide.with(this).
                load(R.drawable.test).
                placeholder(R.drawable.bg_loading).//加載中顯示的圖片
                error(R.drawable.bg_error).//加載失敗時顯示的圖片
                crossFade(1000).//淡入淡出,注意:如果設置了這個,則必須要去掉asBitmap
                override(80, 80).//設置最終顯示的圖片像素爲80*80,注意:這個是像素,而不是控件的寬高
                centerCrop().//中心裁剪,縮放填充至整個ImageView
                skipMemoryCache(true).//跳過內存緩存
                diskCacheStrategy(DiskCacheStrategy.RESULT).//保存最終圖片
                thumbnail(0.1f).//10%的原圖大小
                into(targetView);
    }
}

通過thumbnail(DrawableRequestBuilder)方式來指定縮略圖,該縮略圖可以使用load的所有方式(網絡,文件,uri,資源)加載.

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        //縮略圖請求
        DrawableRequestBuilder<String> thumbnailRequest = Glide
                .with(this)
                .load("http://www.qq745.com/uploads/allimg/141106/1-141106153Q5.png");

        Glide.with(this).
                load(R.drawable.test).
//                placeholder(R.drawable.bg_loading).//加載中顯示的圖片
//                error(R.drawable.bg_error).//加載失敗時顯示的圖片
//                crossFade(1000).//淡入淡出,注意:如果設置了這個,則必須要去掉asBitmap
                override(80, 80).//設置最終顯示的圖片像素爲80*80,注意:這個是像素,而不是控件的寬高
                centerCrop().//中心裁剪,縮放填充至整個ImageView
                skipMemoryCache(true).//跳過內存緩存
                diskCacheStrategy(DiskCacheStrategy.RESULT).//保存最終圖片
                thumbnail(thumbnailRequest).//設置縮略圖
                into(targetView);
    }
}

動畫處理

通過animate()方法可以設置xml文件定義的4種補間動畫(alpha、scale、translate、rotate) 
例如:

res\anim\left_in.xml

[html] view plain copy

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromXDelta="-50%p"
        android:toXDelta="0"/>
    <alpha
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromAlpha="0.0"
        android:toAlpha="1.0"/>
</set>

使用方式:

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);
        Glide.with(this).
                load(R.drawable.test).
                asBitmap().
                animate(R.anim.left_in).//加載xml文件定義的動畫
                into(targetView);
    }
}

處理此外,還可以通過animate指定屬性動畫:

[html] view plain copy

public class TestGlideActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        ImageView targetView = (ImageView) findViewById(R.id.iv_target);

        ViewPropertyAnimation.Animator animationObject = new ViewPropertyAnimation.Animator() {
            @Override
            public void animate(View view) {
                //設置屬性動畫
                ObjectAnimator moveIn = ObjectAnimator.ofFloat(view, "translationX", -500f, 0f);
                ObjectAnimator rotate = ObjectAnimator.ofFloat(view, "rotation", 0f, 360f);
                ObjectAnimator fadeInOut = ObjectAnimator.ofFloat(view, "alpha", 1f, 0f, 1f);
                ObjectAnimator moveTop = ObjectAnimator.ofFloat(view, "translationY", 0f, -2000, 0f);
                AnimatorSet animSet = new AnimatorSet();
                //先左進,然後旋轉伴隨淡入效果,最後移動向上
                animSet.play(rotate).with(fadeInOut).after(moveIn).before(moveTop);
                animSet.setDuration(5000);
                animSet.start();
            }
        };
        Glide.with(this).
                load(R.drawable.test).
                asBitmap().
                animate(animationObject).//加載屬性動畫
                into(targetView);
    }
}