當下有很多圖片加載框架,常見的有Glide、Fresco、Picasso等。Glide因為其體積小、緩存機制強大等優點,受到了廣大程序員的青睞;Fresco雖然體積比較大,緩存機制也沒有Glide強大,但它勝在擁有一些炫酷的效果(進度條、淡入效果)等,也有很多人在使用。今天我們就來介紹一下Fresco的使用。
先貼出【Fresco的中文官方文檔】。
1、配置環境
使用Fresco需要先在build.gradle中導入依賴:
// Fresco所需依賴 compile 'com.facebook.fresco:fresco:0.12.0' // 在 API < 14 上的機器支持 WebP 時,需要添加 compile 'com.facebook.fresco:animated-base-support:0.12.0' // 支持 GIF 動圖,需要添加 compile 'com.facebook.fresco:animated-gif:0.12.0' // 支持 WebP (靜態圖+動圖),需要添加 compile 'com.facebook.fresco:animated-webp:0.12.0' compile 'com.facebook.fresco:webpsupport:0.12.0'
如果需要從網絡中下載圖片,則需要在AndroidManifest.xml文件中配置網絡權限:
<uses-permission android:name="android.permission.INTERNET" />
最后,在項目的Application中初始化Fresco:
public class MyApplication extends Application { @Override public void onCreate() { super.onCreate(); // 初始化Fresco Fresco.initialize(this); } }
別忘了在AndroidManifest.xml文件中為Application添加name屬性:
<application android:name=".MyApplication"> ...... </application>
2、SimpleDraweeView
2.1、XML屬性
Fresco為我們提供了一個SimpleDraweeView控件,我們可以直接在這個控件中加載圖片。Fresco在這個控件中集成了很多屬性,簡單實用。以下是SimpleDraweeView中的常用屬性:
fresco:actualImageScaleType:實際加載的圖片的伸縮樣式
fresco:backgroundImage:底層圖片資源
fresco:fadeDuration:進度條和占位符圖片逐漸消失、加載的圖片逐漸顯示的時間間隔
fresco:failureImage:加載失敗時顯示的圖片資源
fresco:failureImageScaleType:加載失敗時加載的圖片的伸縮樣式
fresco:overlayImage:在顯示的圖片表層覆蓋一張圖片的圖片資源
fresco:placeholderImage:占位符圖片資源
fresco:placeholderImageScaleType:占位符圖片的伸縮樣式
fresco:progressBarAutoRotateInterval:進度條圖片轉動周期
fresco:progressBarImage:進度條圖片資源
fresco:progressBarImageScaleType:進度條圖片的伸縮樣式
fresco:retryImage:提示重新加載的圖片資源
fresco:retryImageScaleType:提示重新加載的圖片的伸縮樣式
fresco:roundAsCircle:將圖片剪切成圓形
fresco:viewAspectRatio:圖片寬高比
我們的XML布局文件中的代碼如下:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:fresco="http://schemas.android.com/apk/res-auto" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent"> <com.facebook.drawee.view.SimpleDraweeView android:id="@+id/id_main_sdv_sdv" android:layout_width="match_parent" android:layout_height="wrap_content" fresco:actualImageScaleType="focusCrop" fresco:fadeDuration="3000" fresco:failureImage="@mipmap/ic_launcher" fresco:failureImageScaleType="centerInside" fresco:placeholderImage="@mipmap/ic_launcher" fresco:placeholderImageScaleType="fitCenter" fresco:progressBarAutoRotateInterval="1000" fresco:progressBarImage="@mipmap/ic_launcher" fresco:progressBarImageScaleType="centerInside" fresco:retryImage="@mipmap/ic_launcher" fresco:retryImageScaleType="centerCrop" fresco:roundAsCircle="false" fresco:viewAspectRatio="1.6" /> <Button android:id="@+id/id_main_btn_load" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_margin="20.0dip" android:text="Start Load Image" /> </RelativeLayout>
2.2、注意事項
(1)SimpleDraweeView控件的寬高不能設置為wrap_content,只能是match_parent、具體值或使用viewAspectRatio屬性設置寬高比。
(2)如果在一個頁面中加載多張圖片,不要將SimpleDraweeView直接放在ScollView中,建議使用RecyclerView、ListView或GridView,因為ScrollView中的SimpleDraweeView會持有內存直到Activity或Fragment銷毀。
(3)使用SimpleDraweeView時,不要使用imageView中有、View中沒有的屬性。
3、框架使用
3.1、簡單使用
像TextView、Button等其他控件一樣后去到SimpleDraweeView,然后調用如下代碼即可加載網絡圖片:
SimpleDraweeView sdv = (SimpleDraweeView) findViewById(R.id.id_main_sdv_sdv);
sdv.setImageURI("http://image5.tuku.cn/pic/wallpaper/fengjing/menghuandaziranmeijingbizhi/009.jpg");
3.2、JAVA代碼設置屬性
我們可以通過GenericDraweeHierarchy,在JAVA代碼中動態的設置SimpleDraweeView控件的屬性。需要注意的是,如果在JAVA代碼中設置了屬性,那么XML文件中設置的屬性就都無效了。一個實例代碼如下:
// 代碼設置SimpleDraweeView的屬性(會覆蓋XML設置的所有屬性,即在XML中有在這里沒有的屬性都會失效) // 注意:一個GenericDraweeHierarchy是不能被多個SimpleDraweeView共用的 GenericDraweeHierarchy hierarchy = new GenericDraweeHierarchyBuilder(getResources()) .setFadeDuration(3000) .setPlaceholderImage(R.mipmap.ic_launcher) .setPlaceholderImageScaleType(ScalingUtils.ScaleType.FIT_XY) .setProgressBarImage(new ProgressBarDrawable()) // 顯示進度條(Fresco自帶的進度條) .build(); // 設置圖片圓角 RoundingParams roundingParams = new RoundingParams(); roundingParams.setRoundAsCircle(false); // 不將圖片剪切成圓形 roundingParams.setCornersRadius(200); hierarchy.setRoundingParams(roundingParams); // 為SimpleDraweeView設置屬性 sdv.setHierarchy(hierarchy);
注意:不能把同一個GenericDraweeHierarchy對象設置給多個SimpleDraweeView!
3.3、設置下載事件
sdv.setController(Fresco.newDraweeControllerBuilder() .setControllerListener(new BaseControllerListener<ImageInfo>() { @Override public void onFinalImageSet(String id, ImageInfo imageInfo, Animatable animatable) { // 所有圖片都加載成功時觸發的方法 int width = imageInfo.getWidth(); int height = imageInfo.getHeight(); QualityInfo qualityInfo = imageInfo.getQualityInfo(); int quality = qualityInfo.getQuality(); boolean isOfFullQuality = qualityInfo.isOfFullQuality(); boolean isOfGoodEnoughQuality = qualityInfo.isOfGoodEnoughQuality(); } @Override public void onIntermediateImageSet(String id, ImageInfo imageInfo) { // 加載漸進式圖片時回調的方法 } @Override public void onFailure(String id, Throwable throwable) { // 加載圖片失敗時回調的方法 } }) .setUri("http://image5.tuku.cn/pic/wallpaper/fengjing/menghuandaziranmeijingbizhi/009.jpg") .build());
3.4、漸進式圖片
漸進式圖片是一種支持圖片從模糊到清晰的加載模式。代碼如下:
sdv.setController(Fresco.newDraweeControllerBuilder() .setImageRequest(ImageRequestBuilder.newBuilderWithSource( Uri.parse("http://image5.tuku.cn/pic/wallpaper/fengjing/menghuandaziranmeijingbizhi/009.jpg")) .setProgressiveRenderingEnabled(true) .build()) .setOldController(sdv.getController()) .build());
以上就是對Fresco的基本使用方法的介紹,希望對大家有幫助~~~