本文為菜鳥窩作者劉婷的連載。”商城項目實戰(zhàn)”系列來聊聊仿”京東淘寶的購物商城”如何實現(xiàn)。
140套Android優(yōu)秀開源項目源碼，領(lǐng)取地址：http://mp.weixin.qq.com/s/afPGHqfdiApALZqHsXbw-A
或勾搭運營小姐姐（微xin：BT474849）免費領(lǐng)
Fresco 是由 Facebook 開源的一款專門為 Android 圖片加載的組件，圖片加載的開源框架有不少，比如大家所熟悉的 Android-Universal-Image-Loader 、Picasso 等等，但是 Fresco 因其有著獨特的優(yōu)勢而受到廣大開發(fā)者的喜愛，本篇文章就一起來學(xué)習(xí)強(qiáng)大的 Fresco 到底有哪些迷人之處，同時又是如何使用的。
Fresco 的詳細(xì)介紹
1. Fresco 是什么
首先，F(xiàn)resco 是一款開源的圖片加載組件，也是目前最強(qiáng)大的圖片加載組件。
其次，F(xiàn)resco 中設(shè)計有一個叫做 image pipeline 的模塊。它負(fù)責(zé)從網(wǎng)絡(luò)，從本地文件系統(tǒng)，本地資源加載圖片。 為了最大限度節(jié)省空間和CPU時間，它含有3級緩存設(shè)計（2級內(nèi)存，1級文件）。
另外，還有一個特別的地方，F(xiàn)resco 中設(shè)計有一個叫做 Drawees 模塊， 方便地顯示 loading 圖，當(dāng)圖片不再顯示在屏幕上時，及時地釋放內(nèi)存和空間占用。
同時，F(xiàn)resco 支持 Android 2.3(API level 9)及其以上版本。
2. Fresco 的獨特之處
Fresco 作為眾多開源圖片加載組件之一，可以受到廣大開發(fā)者的喜愛，自然有著它的獨特之處。
2.1 內(nèi)存管理
一個沒有未壓縮的圖片，即 Android 中的 Bitmap，占用大量的內(nèi)存。大的內(nèi)存占用勢必引發(fā)更加頻繁的GC。 在5.0以下，GC 將會顯著地引發(fā)界面卡頓。
在5.0以下系統(tǒng)，F(xiàn)resco 將圖片放到一個特別的內(nèi)存區(qū)域，也就是 Ashmem (系統(tǒng)匿名共享內(nèi)存)。當(dāng)然，在圖片不顯示的時候，占用的內(nèi)存會自動被釋放。 這會使得 APP 更加流暢，減少因圖片內(nèi)存占用而引發(fā)的 OOM。
2.2 漸進(jìn)式呈現(xiàn)圖片
Fresco 加載圖片時，可以實現(xiàn)漸進(jìn)式呈現(xiàn)圖片，漸進(jìn)式的 JPEG 圖片格式已經(jīng)流行數(shù)年了，漸進(jìn)式圖片格式先呈現(xiàn)大致的圖片輪廓，然后隨著圖片下載的繼續(xù)， 呈現(xiàn)逐漸清晰的圖片，這對于移動設(shè)備，尤其是慢網(wǎng)絡(luò)有極大的利好，可帶來更好的用戶體驗。
2.3 支持Gif圖和WebP格式
作為加載組件，F(xiàn)resco 不僅支持簡單的 JPG、PNG 格式的圖片加載，還同時支持 Gif 和 WebP 格式的圖片加載，非常強(qiáng)大。
2.4 圖像的呈現(xiàn)方式
Fresco 的圖像呈現(xiàn)方式也很特別，可以自定義居中焦點(對人臉等圖片顯示非常有幫助)，支持圓角圖，當(dāng)然圓圈也行，并且下載失敗之后，點擊可以重新下載，特別是可以自定義占位圖，自定義 overlay, 或者進(jìn)度條，同時可以指定用戶按壓時的 overlay。
2.5 圖像的加載
圖像的加載時很重要的一部分，F(xiàn)resco 可以為同一個圖片指定不同的遠(yuǎn)程路徑，或者使用已經(jīng)存在本地緩存中的圖片，加載時先顯示一個低解析度的圖片，等高清圖下載完之后再顯示高清圖，等到加載完成時回調(diào)通知，并且對于本地圖，如有 EXIF 縮略圖，在大圖加載完成之前，可先顯示縮略圖。至于縮放或者旋轉(zhuǎn)圖片和處理已下載的圖片，F(xiàn)resco 都是可以做到的。
Fresco 的基本使用
前面已經(jīng)對 Fresco 做了非常詳細(xì)的介紹了，對于 Fresco 一定很感興趣吧，下面就開始使用它吧。
1. 添加 Gradle 依賴
在使用 Fresco 之前，一定要記得先使用 Gradle 添加對 Fresco 的依賴，代碼如下。、
dependencies {
compile fileTree(include: ['*.jar'], dir: 'libs')
compile 'com.android.support:appcompat-v7:25.0.1'
compile 'com.facebook.fresco:fresco:0.12.0'
}
2. 添加權(quán)限
加載網(wǎng)絡(luò)圖片時，需要一定的網(wǎng)絡(luò)權(quán)限，所以必須添加網(wǎng)絡(luò)權(quán)限。
<uses-permission android:name="android.permission.INTERNET"/>
3. 初始化 Fresco
在加載圖片之前，你必須初始化 Fresco 類。你只需要調(diào)用 Fresco.initialize() 一次即可完成初始化，在 Application 里面做這件事再適合不過了（如下面的代碼），注意多次的調(diào)用初始化是無意義的。
public class CniaoApplication extends Application {
@Override
public void onCreate() {
super.onCreate();
Fresco.initialize(this,config);
}
}
下面就是需要在 AndroidManifest.xml 中指定相應(yīng)的 Application 類。
<application
android:name=".CniaoApplication"
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
.......
</application>
4. 添加 SimpleDraweeView
首先，在 xml 布局文件 Layout 中, 加入命名空間。
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fresco="http://schemas.android.com/apk/res-auto"
android:layout_height="match_parent"
android:layout_width="match_parent">
......
</LinearLayout>
然后在布局中加入 SimpleDraweeView。
<com.facebook.drawee.view.SimpleDraweeView
android:id="@+id/image_view"
android:layout_width="500dp"
android:layout_height="300dp"
fresco:placeholderImage="@drawable/default_loading"
/>
5. 加載圖片
在 Activity/Fragment 中寫入圖片加載即可。
public class MainActivity extends AppCompatActivity {
private String img_url="http://img4q.duitang.com/uploads/item/201411/20/20141120132318_3eAuc.thumb.700_0.jpeg";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Uri uri = Uri.parse(img_url);
SimpleDraweeView draweeView = (SimpleDraweeView) findViewById(R.id.image_view);
draweeView.setImageURI(uri);
}
}
6. 效果圖
運行代碼獲取效果圖，如下圖所示。
[圖片上傳失敗...(image-29edc4-1565145188330)]
Fresco 的基本使用就是這些了，功能很強(qiáng)大，使用很簡單，更多的使用可以參考 Fresco 官網(wǎng)
