1. 程式人生 > >強大的圖片載入框架Picasso和Glide

強大的圖片載入框架Picasso和Glide

一、Picasso

Picasso是Square公司出品的一個強大的圖片下載和快取圖片庫。官方網址是:http://square.github.io/picasso/

只需要一句程式碼就可以將圖片下載並設定到ImageView上。

特點:

   1.在adapter中需要取消已經不在視野範圍的ImageView圖片資源的載入,否則會導致圖片錯位,Picasso已經解決了這個問題

   2.使用複雜的圖片壓縮轉換來儘可能的減少記憶體消耗

   3.自帶記憶體和硬碟二級快取功能

簡單載入例項:
public class MainActivity extends AppCompatActivity 
{ private ImageView mImageView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); init(); } private void init() { mImageView = (ImageView) findViewById(R.id.image); //載入網路圖片 // Picasso.with(this).load("http://i.imgur.com/DvpvklR.png").into(mImageView);
//載入本地圖片 // Picasso.with(this).load(R.drawable.mg2).into(mImageView); //轉換圖片進行裁剪 // Picasso.with(this).load("http://i.imgur.com/DvpvklR.png").resize(200,200).centerCrop().into(mImageView); /** * Place holders-空白或者錯誤佔位圖片 * error:錯誤佔位符 * 如果載入發生錯誤會重複三次請求,三次都失敗才會顯示error Place holder
*/ Picasso.with(this).load("http://i.imgur.com/DvpvklR.png").placeholder(R.mipmap.ic_launcher).error(R.mipmap.ic_launcher).into(mImageView); } }
Adapter中下載:使用ListView,GridView的時候,自動檢測Adapter的重用(re-use),取消下載,使用快取。
@Override public void getView(int position, View convertView, ViewGroup parent) {
  SquaredImageView view = (SquaredImageView) convertView;
  if (view == null) {
    view = new SquaredImageView(context);
  }
  String url = getItem(position);

  Picasso.with(context).load(url).into(view);
}


二、Glide

在泰國舉行的谷歌開發者論壇上,谷歌為我們介紹了一個名叫 Glide 的圖片載入庫,作者是bumptech。這個庫被廣泛的運用在google的開源專案中,包括2014年google I/O大會上釋出的官方app。

Picasso和Glide都在jcenter上。在專案中新增依賴非常簡單。

compile 'com.squareup.picasso:picasso:2.5.2'
compile 'com.github.bumptech.glide:glide:3.7.0'
Glide載入圖片例項:
public class MainActivity extends AppCompatActivity {

    private ImageView mImageView;
@Override
protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
init();
}

    private void init() {
        mImageView = (ImageView) findViewById(R.id.image);
//載入網路圖片
      //  Glide.with(this).load("http://i.imgur.com/DvpvklR.png").into(mImageView);
        //載入本地圖片
      //  Glide.with(this).load(R.drawable.mg2).into(mImageView);
     //   Glide.with(this).load("http://i.imgur.com/DvpvklR.png").placeholder(R.mipmap.ic_launcher).error(R.mipmap.ic_launcher).into(mImageView);
Glide.with(this).load("http://i.imgur.com/DvpvklR.png").placeholder(R.mipmap.ic_launcher).crossFade().into(mImageView);
}

Glide和Picasso非常相似,Glide載入圖片的方法和Picasso如出一轍。雖然兩者看起來一樣,但是Glide更易用,因為Glide的with方法不光接受Context,還接受Activity 和 Fragment,Context會自動的從他們獲取。同時將Activity/Fragment作為with()引數的好處是:圖片載入會和Activity/Fragment的生命週期保持一致,比如Paused狀態在暫停載入,在Resumed的時候又自動重新載入。所以我建議傳參的時候傳遞Activity 和 Fragment給Glide,而不是Context。另外,Glide載入的圖片質量要差於Picasso,這是因為Glide預設的Bitmap格式是RGB_565 ,比ARGB_8888格式的記憶體開銷要小一半。

更新說明:

不久前Glide釋出了新版本4.0,本來也沒注意,結果使用的時候發現:

Glide.with(this).load(R.mipmap.image).placeholder(R.mipmap.ic_launcher).error(R.mipmap.ic_launcher)nima

尼瑪,什麼鬼!預載入圖片和載入失敗顯示圖片這兩個方法竟然不見了,頓時感覺整個人就不好了,這還怎麼玩,官方還聲稱4.0是目前最為頂的一個版本。於是及時去查看了原始碼,發現確實改變很大,不過裡面多了一個這樣的方法:

/**
 * Applies the given options to the request, options set or unset in the given options will
 * replace those previously set in options in this class.
 *
 * @see RequestOptions#apply(RequestOptions)
 * @return This request builder.
 */
public RequestBuilder<TranscodeType> apply(@NonNull RequestOptions requestOptions) {
  Preconditions.checkNotNull(requestOptions);
  this.requestOptions = getMutableOptions().apply(requestOptions);
  return this;
}

英文部分:將給定的選項應用到請求中,在給定選項中設定或取消選項將取代之前在這個類中設定的選項。(純屬百度,個人英語水平有限,見諒啊!)

於是抱著試試看的心態,查看了一下RequestOptions這個類,在這個類中,“不經意”間發現了
public RequestOptions placeholder(int resourceId)
public RequestOptions priority
public RequestOptions diskCacheStrategy
public RequestOptions error
看到這應該就明白了,原來的一些方法,還是可以用的,只不過多了一些設定而已,於是便嘗試了一下:
RequestOptions options = new RequestOptions()
        .placeholder(R.mipmap.ic_launcher)//預載入佔位符
.error(R.mipmap.ic_launcher)//載入失敗佔位符
.centerCrop()
        .priority(Priority.HIGH)//優先順序
.diskCacheStrategy(DiskCacheStrategy.ALL);//快取
Glide.with(this).load(R.mipmap.image).apply(options).into(mImageView);
效果自然是和原來一樣,正常顯示了。真是大吃一驚,4.0的改變,著實有點大,個人感覺還是以前的更好用的一些,非常方便(也有可能是以前的習慣了),不知道這樣改是不是有什麼其他深意,暫時還是比較痛苦的,沒辦法!

在此更新一下,希望看到的道友,不要被先前寫的內容誤導!(不過,如果你的Glide是4.0以下的話,用以前的方法完全是沒問題的!)

Glide4.1.1:

加入依賴的話,出報錯:Error:Failed to resolve: com.android.support:support-annotations:26.0.2(根據個人所用SDK版本不同,後面版本一會不同g)

解決辦法:

在Project的build中:

allprojects {
    repositories {
        jcenter()
        maven {
            url "https://maven.google.com"
}
    }
}
執行一下,搞定!

下面是用Picasso和Glide載入同一張圖片的效果差別:

Picasso:      Glide:

本地圖片:

    

Picasso裁剪圖片: