目前使用在android中的圖片加載框架有不少,有ImageLoader性置,Glide,Picasso拾并,這些框架被用在了很多的項目當(dāng)中,可是當(dāng)Glide或者是Picasso去加載幾千張的圖片時候,依然造成了圖片加載卡頓的現(xiàn)象嗅义,所以這里就要介紹給大家一個非常優(yōu)秀的屏歹、功能十分強大的,在加載幾千張圖片依然流暢的圖片加載框架Fresco芥喇,這個框架的出自Facebook的開發(fā)團隊西采,目前在github的star數(shù)已經(jīng)達到了上萬。
項目地址:https://github.com/facebook/fresco
接下來就來體驗一下Fresco的使用
(一)最簡單的使用
-
在你的app級別的.gradle文件中添加fresco的依賴
compile'com.facebook.fresco:fresco:1.1.0'
-
創(chuàng)建App類继控,繼承自系統(tǒng)中的Application類械馆,重寫onCreate()方法,并在清單文件中配置App類
//最簡單的Fresco初始化 Fresco.initialize(this);
Fresco還重載了兩個初始化的方法武通,另外兩種初始化在后文中再講
-
Fresco對于圖片加載并不是像其他的圖片加載框架一樣霹崎,直接將圖片加載到ImageView中,而是加載到它內(nèi)置的一個繼承自View的DraweeView控件上冶忱。然而我們想要使用Fresco中一些強大的功能的話尾菇,需要用到的是DraweeView的一個子類SimpleDraweeView。
在布局文件中使用SimpleDraweeView<com.facebook.drawee.view.SimpleDraweeView android:id="@+id/sdv" android:layout_width="100dp" android:layout_height="100dp" />
這邊需要注意的是在DraweeView的layout_width和layout_height并不支持wrap_content屬性囚枪,一旦你使用了這個屬性派诬,將會導(dǎo)致view的onLayout()方法重新執(zhí)行,出現(xiàn)畫面的跳躍
加載圖片
Fresco能夠加載以下類型的圖片
類型 | SCHEME | 示例 |
---|---|---|
遠程圖片 | http://, https:// | HttpURLConnection 或者參考 使用其他網(wǎng)絡(luò)加載方案 |
本地文件 | file:// | FileInputStream |
Content provider | content:// | ContentResolver |
asset目錄下的資源 | asset:// | AssetManager |
res目錄下的資源 | res:// | Resources.openRawResource |
Uri中指定圖片數(shù)據(jù) | data:mime/type;base64 | 數(shù)據(jù)類型必須符合 rfc2397規(guī)定 (僅支持 UTF-8) |
這個案例我們就去加載網(wǎng)絡(luò)中的圖片链沼,我隨便在網(wǎng)絡(luò)上找了一張圖片去加載
加載網(wǎng)絡(luò)圖片還需要在manifests文件中增加訪問網(wǎng)絡(luò)圖片的權(quán)限
<uses-permission android:name="android.permission.INTERNET"/>
在activity中進行圖片加載操作
SimpleDraweeView sdv = (SimpleDraweeView) findViewById(R.id.sdv);
sdv.setImageURI("http://pic.58pic.com/58pic/13/77/09/53K58PICEMN_1024.jpg");
對于加載其他類型的圖片默赂,用以下規(guī)則
String imageUri = "http://site.com/image.png"; // 網(wǎng)絡(luò)圖片
String imageUri = "file:///mnt/sdcard/image.png"; //SD卡圖片
String imageUri = "content://media/external/audio/albumart/13"; // 媒體文件夾
String imageUri = "assets:///image.png"; // assets
String imageUri = "res://" + context.getPackageName()+"/" +R.drawable.image; // drawable文件
運行app,發(fā)現(xiàn)圖片成功被加載括勺。
(二)SimpleDraweeView的屬性介紹
上面介紹了Fresco最簡單的用法缆八,接下來就來說下SimpleDrawwwView的所有屬性,這些屬性體現(xiàn)了Fresco強大的地方
屬性 | 說明 | 取值 | |
---|---|---|---|
fadeDuration | 漸進式加載JPEG圖片的時間疾捍,對于其他格式的圖片 漸進式是無效果的 | 整數(shù)類型奈辰,單位s | |
actualImageUri | 圖片的uri地址 | ||
actualImageScaleType | 圖片的縮放的形式 | 見上表 | |
placeholderImage | 設(shè)置占位圖 | ||
failureImage | 設(shè)置加載出現(xiàn)錯誤后顯示的圖片 | ||
failureImageScaleType | 設(shè)置加載出現(xiàn)錯誤后顯示的圖片的縮放形式 | 見上表 | |
retryImage | 重試加載圖 當(dāng)顯示這個圖使,加載錯誤圖片并不顯示乱豆,當(dāng)重試次數(shù)達到4次時奖恰,顯示加載錯誤圖 | ||
retryImageScaleType | 重試加載圖的縮放形式 | 見上表 | |
progressBarImage | 進度條圖片 | ||
progressBarImageScaleType | 進度條圖片縮放形式 | 見上表 | |
progressBarAutoRotateInterval | 進度條旋轉(zhuǎn)時長 | ||
backgroundImage | 背景圖 | ||
overlayImage | 疊加圖 | ||
pressedStateOverlayImage | 圖片按下顯示的圖 | ||
roundAsCircle | 圖片顯示為圓形 | boolean 默認(rèn)false | |
roundedCornerRadius | 圖片顯示為圓角圖的圓角半徑 | 整數(shù)類型 | |
roundTopLeft | 圖片左上角是否需要圓角 | ||
roundTopRight | 圖片右上角是否需要圓角 | ||
roundBottomLeft | 圖片左下角是否需要圓角 | ||
roundBottomRight | 圖片右下角是否需要圓角 | ||
roundWithOverlayColor | 圓形圖片帶疊加圖 | ||
roundingBorderWidth | 將圖片顯示為圓形的寬度 | ||
roundingBorderColor | 圖片顯示成圓形后邊框顏色 | ||
viewAspectRatio | 寬高比,加這個屬性后,layout_width或layout_height中的一個可以是wrap_content |
對于這些屬性的使用就補貼代碼了咙鞍,大家可以自己嘗試一下
(三)對于GIF與WEBP的支持
Fresco不僅支持常見的圖片格式房官,還支持GIF和WEBP格式的圖片
如果你想要你的應(yīng)用支持gif和webp格式圖片,那么需要添加以下依賴:
// 支持 GIF 動圖续滋,需要添加
compile 'com.facebook.fresco:animated-gif:1.1.0'
// 支持 WebP (靜態(tài)圖+動圖)翰守,需要添加
compile 'com.facebook.fresco:animated-webp:1.1.0'
compile 'com.facebook.fresco:webpsupport:1.1.0'
// 僅支持 WebP 靜態(tài)圖,需要添加
compile 'com.facebook.fresco:webpsupport:1.1.0'
(四)切換網(wǎng)絡(luò)底層
Fresco網(wǎng)絡(luò)加載庫默認(rèn)是使用的是HttpUrlConnection疲酌,但是它支持開發(fā)者切換網(wǎng)絡(luò)加載庫
切換網(wǎng)絡(luò)底層蜡峰,講到切換網(wǎng)絡(luò)底層就要回到Fresco的初始化的重載方法了袁,這里使用兩個參數(shù)的初始化方法
Fresco.initialize(Context context,@Nullable ImagePipelineConfig imagePipelineConfig);
這里可以看到需要一個ImagePipelineConfig對象,F(xiàn)resco將圖片加載的工作交給ImagePipelineConfig類去做湿颅,所以對圖片加載的配置都是通過這個類來完成的载绿。
ImagePipelineConfig的對象不能直接new,而是通過其內(nèi)部提供的Builder類的build()方法來構(gòu)造出對象油航。
所以切換底層崭庸,用以下這個類就能完成。
在這里谊囚,我將網(wǎng)絡(luò)底層切換為okhttp怕享。
查看文檔,發(fā)現(xiàn)切換網(wǎng)絡(luò)底層需要我們?nèi)プ远x類繼承NetworkFetchProducer類去完成镰踏,不過Fresco非常人性化的為我們提供依賴函筋,可以快速的將網(wǎng)絡(luò)底層切換為okhttp。
在app的.gradle依賴:
//網(wǎng)絡(luò)加載切換為okhttp2
compile "com.facebook.fresco:imagepipeline-okhttp:1.1.0"
//網(wǎng)絡(luò)加載切換為okhttp3
compile "com.facebook.fresco:imagepipeline-okhttp3:0.1.1.0"
重寫onCreate()方法
ImagePipelineConfig frescoConfig = OkHttpImagePipelineConfigFactory.newBuilder(this,okHttpClient).build();
Fresco.initialize(this,frescoConfig);
參考文獻:Fresco官方使用文檔 https://www.fresco-cn.org/docs/index.html