fresco是facebook推出的一款强大的android图片处理库。它支持圆圈/圆角,缩放,渐进式JPEG图,gif图,图片的缩放旋转等,功能非常强大。下面我带大家一起进入到 Fresco的世界。fresco官网地址
引入Fresco
1. Android Studio 或者 Gradle
检查最外层.gradle 文件中是否包含Maven中央库
allprojects {
repositories {
jcenter()
mavenCentral() //注意如果没有,请加上
}
}
在app的.gradle文件中添加
dependencies {
compile 'com.facebook.fresco:fresco:0.9.0+'
}
最后 Rebuild Project 就导入成功了。
2. Eclipse ADT
使用eclipse就相对比较麻烦一些,首先到 [github地址]上下载文件。
(https://github.com/facebook/fresco)
- 从菜单 “文件(File)”,选择导入(Import)
- 展开 Android, 选择 “Existing Android Code into Workspace”, 下一步。
- 浏览,选中刚才解压的的文件中的 frescolib 目录。
- 这5个项目应该都会被添加到工程: drawee, fbcore, fresco, imagepipeline, imagepipeline-okhttp。请确认前4个项目一定是被选中的。点击完成。
- 右键,项目,选择属性,然后选择 Android。
- 点击右下角的 Add 按钮,选择 fresco,点击 OK,再点击 OK。
支持的URIs
类型 | Scheme | 示例 |
---|---|---|
远程图片 | http://, https:// | HttpURLConnection |
本地文件 | file:// | FileInputStream |
Content provider | content:// | ContentResolver |
asset目录下的资源 | asset:// | AssetManager |
res目录下的资源 | res:// | Resources.openRawResource |
res 示例:Uri uri = Uri.parse(“res://包名(实际可以是任何字符串甚至留空)/” + R.drawable.ic_launcher);
加载网络图片
1. AndroidManifest.xml 配置
为了下载网络图片,请确保在 AndroidManifest.xml 中有以下权限:
<uses-permission android:name="android.permission.INTERNET" />
2. 初始化
在Application中:
@Override
public void onCreate() {
super.onCreate();
Fresco.initialize(sInstance); //Fresco的初始化
}
或者在Activity中,调用 setContentView() 之前,进行初始化:
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Fresco.initialize(sInstance); //Fresco的初始化
setContentView(R.layout.activity_initialize);
}
3. 布局xml文件
<com.facebook.drawee.view.SimpleDraweeView
xmlns:fresco="http://schemas.android.com/apk/res-auto"
android:id="@+id/my_image_view"
android:layout_width="20dp"
android:layout_height="20dp"
fresco:placeholderImage="@drawable/my_drawable"
/>
placeholderImage属性表示的是占位符。需要注意layout_width,layout_height不支持wrap_content 如果要设置宽高比, 需要在Java代码中指定setAspectRatio(1.33f)。
4. 代码中使用
Uri uri = Uri.parse("https://raw.githubusercontent.com/facebook/fresco/gh-pages/static/fresco-logo.png");//访问图片的地址
SimpleDraweeView draweeView = (SimpleDraweeView) findViewById(R.id.my_image_view);
draweeView.setImageURI(uri);
剩下的,Fresco会替你完成:
- 显示占位图直到加载完成;
- 下载图片;
- 缓存图片;
- 图片不再显示时,从内存中移除;
圆角/圆圈
xml中配置
fresco:roundedCornerRadius="5dp"
fresco:roundBottomLeft="false"
fresco:roundBottomRight="false"
fresco:roundWithOverlayColor="@color/blue"
fresco:roundingBorderWidth="1dp"
fresco:roundingBorderColor="@color/red"
roundedCornerRadius:圆角的半径
roundBottomLeft:不设置圆角,以直角显示
roundWithOverlayColor:覆盖物颜色
roundingBorderWidth:边角半径
roundingBorderColor:边角颜色
roundAsCircle:true设置为圆圈,false不为圆圈
看下效果图:
代码中
RoundingParams roundingParams =
mSimpleDraweeView.getHierarchy().getRoundingParams();
roundingParams.setBorder(R.color.red, 1.0);
roundingParams.setRoundAsCircle(true);
mSimpleDraweeView.getHierarchy().setRoundingParams(roundingParams);
修改图片
ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
.setResizeOptions(new ResizeOptions(width, height))//width修改的宽度 height修改的高度
.setAutoRotateEnabled(true) //设置是否旋转
.setPostprocessor(redMeshPostprocessor)//设置网格
.build();
PipelineDraweeController controller = Fresco.newDraweeControllerBuilder()
.setOldController(mSimpleDraweeView.getController())
.setImageRequest(request)
.build();
mSimpleDraweeView.setController(controller);
在XML中使用Drawees
<com.facebook.drawee.view.SimpleDraweeView
android:id="@+id/my_image_view"
android:layout_width="20dp" // 不支持wrap_content 如果要设置 宽高比, 需要在Java代码中指定setAspectRatio(1.33f);
android:layout_height="20dp" // 不支持wrap_content
fresco:fadeDuration="300"
fresco:actualImageScaleType="focusCrop"
// 设置图片缩放. 通常使用focusCrop,该属性值会通过算法把人头像放在中间
fresco:placeholderImage="@color/wait_color"
// 下载成功之前显示的图片
fresco:placeholderImageScaleType="fitCenter"
fresco:failureImage="@drawable/error"
// 加载失败的时候显示的图片
fresco:failureImageScaleType="centerInside"
fresco:retryImage="@drawable/retrying"
// 加载失败,提示用户点击重新加载的图片(会覆盖failureImage的图片)
fresco:retryImageScaleType="centerCrop"
fresco:progressBarImage="@drawable/progress_bar"// 提示用户正 在加载,和加载进度无关
fresco:progressBarImageScaleType="centerInside"
fresco:progressBarAutoRotateInterval="1000"
fresco:backgroundImage="@color/blue"
fresco:overlayImage="@drawable/watermark"
fresco:pressedStateOverlayImage="@color/red"
fresco:roundAsCircle="false"
// 是不是设置圆圈
fresco:roundedCornerRadius="1dp"
// 圆角角度,180的时候会变成圆形图片
fresco:roundTopLeft="true"
fresco:roundTopRight="false"
fresco:roundBottomLeft="false"
fresco:roundBottomRight="true"
fresco:roundWithOverlayColor="@color/corner_color"
fresco:roundingBorderWidth="2dp"
fresco:roundingBorderColor="@color/border_color"
/>