1. 程式人生 > >Android 強大的圖片載入庫Fresco,Fresco介紹

Android 強大的圖片載入庫Fresco,Fresco介紹

Fresco 中文版 v1.1 PDF下載:

http://yaphet.ctfile.com/fs/9Ah147781160

Fresco介紹:

Fresco是一個由facebook開源的強大的圖片顯示系統。Fresco考慮到了安卓中圖片載入的幾乎所有問題,可以載入來自網路、本地、以及應用資原始檔中的圖片,同時在圖片載入完成之前會顯示一個佔位圖片,提供二級快取,還支援gif動態圖。Fresco將圖片放在一個特殊的記憶體區域,因此更容易避免OutOfMemoryError。這是以個以c++思維方式寫出的java程式(Write code in Java, but think like C++ )。缺點:過於龐大。

關於 Fresco:

Fresco 是一個強大的圖片載入元件。
Fresco 中設計有一個叫做 image pipeline 的模組。它負責從網路,從本地檔案系統,本地資源載入圖片。為了最大限度節省空間和CPU時間,它含有3級快取設計(2級記憶體,1級檔案)。
Fresco 中設計有一個叫做 Drawees 模組,方便地顯示loading圖,當圖片不再顯示在螢幕上時,及時地釋放記憶體和空間佔用。
Fresco 支援 Android2.3(API level 9) 及其以上系統。

記憶體管理:
解壓後的圖片,即Android中的Bitmap,佔用大量的記憶體。大的記憶體佔用勢必引發更加頻繁的GC。在5.0以下,GC將會顯著地引發介面卡頓。
在5.0以下系統,Fresco將圖片放到一個特別的記憶體區域。當然,在圖片不顯示的時候,佔用的記憶體會自動被釋放。這會使得APP更加流暢,減少因圖片記憶體佔用而引發的OOM。
Fresco 在低端機器上表現一樣出色,你再也不用因圖片記憶體佔用而思前想後。

圖片的漸進式呈現:
漸進式的JPEG圖片格式已經流行數年了,漸進式圖片格式先呈現大致的圖片輪廓,然後隨著圖片下載的繼續,呈現逐漸清晰的圖片,這對於移動裝置,尤其是慢網路有極大的利好,可帶來更好的使用者體驗。
Android 本身的圖片庫不支援此格式,但是Fresco支援。使用時,和往常一樣,僅僅需要提供一個圖片的URI即可,剩下的事情,Fresco會處理。

Gif圖和WebP格式:
是的,支援載入Gif圖,支援WebP格式。

影象的呈現:
Fresco 的 Drawees 設計,帶來一些有用的特性:
自定義居中焦點(對人臉等圖片顯示非常有幫助)
圓角圖,當然圓圈也行。
下載失敗之後,點選重現下載
自定義佔點陣圖,自定義overlay, 或者進度條
指定使用者按壓時的overlay

影象的載入
Fresco 的 image pipeline 設計,允許使用者在多方面控制圖片的載入:
為同一個圖片指定不同的遠端路徑,或者使用已經存在本地快取中的圖片
先顯示一個低解析度的圖片,等高清圖下載完之後再顯示高清圖
載入完成回撥通知
對於本地圖,如有EXIF縮圖,在大圖載入完成之前,可先顯示縮圖
縮放或者旋轉圖片
處理已下載的圖片
WebP 支援

更多:
相關部落格: Fresco的釋出(https://code.facebook.com/posts/366199913563917)
下載 Fresco(http://fresco-cn.org/docs/download-fresco.html)科學上網
文件(http://fresco-cn.org/docs/index.html)
GitHub的原始碼(https://github.com/facebook/fresco)

引入Fresco:

1. Android Studio 或者 Gradle

dependencies {
compile 
'com.facebook.fresco:fresco:0.6.0+'
}
2. Intellij IDEA 或者 Maven

這是一個在 Intellij IDEA 的工程簡單示例: https://github.com/liaohuqiu/fresco-demo-for-maven ,可供參考。
在這個 issue 解決之前,pom 中相關依賴缺少 type 欄位,通過以下方式無法直接引入:

<dependency>
  <groupId>com.facebook.fresco</groupId>
  <artifactId>fresco</artifactId>
  <version>LATEST</version>
</dependency>
需要這樣:
<!-- use this version, exclude all the other version from the other libraries. -->
<dependency>
    <groupId>com.android.support</groupId>
    <artifactId>support-v4</artifactId>
    <version>21.0.3</version>
    <type>aar</type>
</dependency>
<!-- begin of fresco -->
<dependency>
    <groupId>com.facebook.fresco</groupId>
    <artifactId>fresco</artifactId>
    <version>0.6.0</version>
    <type>aar</type>
    <exclusions>
        <exclusion>
            <groupId>com.android.support</groupId>
            <artifactId>support-v4</artifactId>
        </exclusion>
        <exclusion>
            <groupId>com.facebook.fresco</groupId>
            <artifactId>*</artifactId>
        </exclusion>
    </exclusions>
</dependency>
<dependency>
    <groupId>com.facebook.fresco</groupId>
    <artifactId>fbcore</artifactId>
    <type>aar</type>
    <version>0.6.0</version>
</dependency>
<dependency>
    <groupId>com.facebook.fresco</groupId>
    <artifactId>drawee</artifactId>
    <type>aar</type>
    <version>0.6.0</version>
    <exclusions>
        <exclusion>
            <groupId>com.android.support</groupId>
            <artifactId>support-v4</artifactId>
        </exclusion>
        <exclusion>
            <groupId>com.facebook.fresco</groupId>
            <artifactId>fbcore</artifactId>
        </exclusion>
    </exclusions>
</dependency>
<dependency>
    <groupId>com.facebook.fresco</groupId>
    <artifactId>imagepipeline</artifactId>
    <type>aar</type>
    <version>0.6.0</version>
    <exclusions>
        <exclusion>
            <groupId>com.android.support</groupId>
            <artifactId>support-v4</artifactId>
        </exclusion>
        <exclusion>
            <groupId>com.facebook.fresco</groupId>
            <artifactId>fbcore</artifactId>
        </exclusion>
    </exclusions>
</dependency>
<!-- end of fresco -->
很醜陋對吧,抱歉目前暫時只能這樣,有更好的辦法請一定告訴我。
重新整理 Maven 工程,下載引用,下載完成之後,將:
gen-external-apklibs/com.facebook.fresco_imagepipeline_{版本號}/jni
目錄下的三個資料夾:armeabi,armeabi-v7a,x86 這三個資料夾拷貝到 libs 資料夾下。

3. Eclipse ADT
首先,下載這個檔案.
解壓後,你會看到一個目錄:frescolib,注意這個目錄。
從選單 “檔案(File)”,選擇匯入(Import)
展開 Android, 選擇 “Existing Android Code into Workspace”, 下一步。
瀏覽,選中剛才解壓的的檔案中的 frescolib 目錄。
這5個專案應該都會被新增到工程: drawee, fbcore, fresco, imagepipeline, imagepipeline-okhttp。請確認前4個專案一定是被選中的。點選完成。
右鍵,專案,選擇屬性,然後選擇 Android。
點選右下角的 Add 按鈕,選擇 fresco,點選 OK,再點選 OK。
現在,fresco 就匯入到專案中了,你可以開始編譯了。如果編譯不通過,可以嘗試清理資源,或者重啟 Eclipse。
如果你想在網路層使用 OkHttp,請看這裡.
如果 support-v4 包重複了,刪掉 frescolib/imagepipeline/libs 下的即可。

建議儘早使用 Android Studio。
Fresco 是一個典型的Android Studio 專案。
如果想編譯原始碼, 看demo專案,可以通過gradle或者Android Studio
一直以來,在國內更新Android SDK以及使用Android Studio匯入專案時,都是一件麻煩的事情。
使用gradle 或者 Android Studio會遇到一些網路障礙。這些障礙,使用 紅杏為開發者開放的免費的公益代理 可以解決。
另外對於NDK,因為Android Studio還支援不夠。所以需要在命令列下預編譯。

使用:

初始化

Fresco.initialize(context);
自定義名稱空間
<!-- Any valid element will dohere -->
<LinearLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fresco="http://schemas.android.com/apk/res-auto"></span>
新增view
<span style="font-size:14px;"><com.facebook.drawee.view.SimpleDraweeView
android:id="@+id/my_image_view"
android:layout_width="20dp"
android:layout_height="20dp"
fresco:placeholderImage="@drawable/my_drawable"/>
顯示圖片只需一行程式碼,Fresco 為你做其餘的事情。圖片將被下載,快取,顯示,同時在view退出螢幕的時候清理記憶體。