###########Android的Glide库加载图片的用法及其与Picasso的对比#######
前面单独写过一篇关于Picasso的,现在先来介绍一下Glide吧。
首先Glide是一个安卓设备上面的媒体播放框架Glide具有获取、解码和展示视频剧照、图片、动画等功能。
Glide 3.0版本以后加入了多项重要功能,如下:
1:GIF动画的解码加载:
通过调用Glide.with(context).load(“图片路径“)方法,GIF动画图片可以自动显示为动画效果。
使用Glide.with(context).load(“图片路径“).asGif()方法加载动画图片
2:本地视频剧照的解码:
调用Glide.with(context).load(“图片路径“)方法,Glide能够支持Android设备中的所有视频剧照的加载和展示
3:得到缩略图
调用Glide.with(context).load(“图片路径“).thumbnail(“缩略比例“).into(“view组件“)方法加载一个缩略图
4:动画的支持
动画的支持:新增支持图片的淡入淡出动画效果(调用crossFade()方法)和查看动画的属性的功能
5:可以选择基本所有的网络请求框架 默认是httpurlconnection
6:如在图片加载过程中,使用Drawables对象作为占位符、图片请求的优化、图片的宽度和高度可重新设定、缩略图和原图的缓存等功能
7: 同步Activity和FRAGMENT的生命周期。可是自动实现GIF动态图的暂停播放继续播放等
8:自动实现多套尺寸图的缓存,导致加载图片的速度提高。
Glide的使用
1依赖方式导包
dependencies {
compile 'com.github.bumptech.glide:glide:3.5.2'
compile 'com.android.support:support-v4:22.0.0'
}
对比Picasso:
dependencies {
compile 'com.squareup.picasso:picasso:2.5.1'
}
2基本的加载图片的代码
Glide.with(context)
.load("http://inthecheesefactory.com/uploads/source/glidepicasso/cover.jpg")
.into(ivImg);
对比Picasso:
Picasso.with(context)
.load("http://inthecheesefactory.com/uploads/source/glidepicasso/cover.jpg")
.into(ivImg);
注意:1:虽然我们在这里看到的形式是一样的,但是Glide支持在with()中即支持Context,而且支持Activity 和 Fragment。With()方法从你放入的任何东西中取出自己需要的context.
在这里传入Activity 和 Fragment,Glide就会自动的实现生命周期方法的同步,比如 Paused状态在暂停加载,在Resumed的时候又自动重新加载。
2:Glide默认的图片加载的格式为RGB_565,Picasso默认的图片加载的格式为ARGB8888,所以前者在默认的情况下对于图片的呈现肯定效果上面是差于后者的。不过我们也是有方法提高Glide的图片格式为ARGB_8888:
public class GlideConfiguration implements GlideModule {
@Override
public void applyOptions(Context context, GlideBuilder builder) {
// Apply options to the builder here.
builder.setDecodeFormat(DecodeFormat.PREFER_ARGB_8888);
}
@Override
public void registerComponents(Context context, Glide glide) {
// register ModelLoaders here.
}
}
然后在AndroidManifest.xml中将GlideModule定义为meta-data
<meta-data android:name="com.inthecheesefactory.lab.glidepicasso.GlideConfiguration"
android:value="GlideModule"/>
经过这样的处理之后我们会看见虽然两者都使用了ARGB_8888,但是Glide的内存消耗还是远远小于Picasso的内存消耗
所以我们应该思考为啥会有这么大的内存的差异?
原因就是Glide可以自动计算出传入的控件的大小,但是我们的Picasso是原图展示的,比较笨。
改进Picasso的方法:
1设置成为死的大小:
Picasso.with(this)
.load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")
.resize(768, 432)
.into(ivImgPicasso);
2自动适应的代码:
Picasso.with(this)
.load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")
.fit()
.centerCrop()
.into(ivImgPicasso);
当然从画面的质量来看的话:Glide 加载的图片有些像素点变得很模糊,看起来也没有 Picasso 那么平滑。
3磁盘缓存
Picasso和Glide在磁盘缓存策略上有很大的不同。我们刚刚做了一个使用 Glide 和 Picasso 加载同一张高清图片的实验,我在实验后检查缓存目录时发现: Glide 缓存的图片和 ImageView 的尺寸相同,而 Picasso 缓存的图片和原始图片的尺寸相同。
不管大小如何Picasso只缓存一个全尺寸的。Glide则不同,它会为每种大小的ImageView缓存 一次。尽管一张图片已经缓存了一次,但是假如你要在另外一个地方再次以不同尺寸显示,需要重新下载,调整成新尺寸的大小,然后将这个尺寸的也缓存起来。也就是说当尺寸不同的时候Glide默认会进行多次网络请求去加载。
当然我们可以利用代码来改变这种情况,我们只需要设置他无论如何都要缓存一张全景图就可以了:
Glide.with(this)
.load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(ivImgGlide);
Glide的这种方式优点是加载显示非常快。而Picasso的方式则因为需要在显示之前重新调整大小而导致一些延迟
4:两者都能干的事:
Image Resizing
// Picasso
.resize(300, 200);
// Glide
.override(300, 200);
Center Cropping
// Picasso
.centerCrop();
// Glide
.centerCrop();
Transforming
// Picasso
.transform(new CircleTransform())
// Glide
.transform(new CircleTransform(context))
设置占位图或者加载错误图:
// Picasso
.placeholder(R.drawable.placeholder)
.error(R.drawable.imagenotfound)
// Glide
.placeholder(R.drawable.placeholder)
.error(R.drawable.imagenotfound)
5:只能Glide干的事:
A:Glide可以加载GIF动态图,而Picasso不能。
同时因为Glide和Activity/Fragment的生命周期是一致的,因此gif的动画也会自动的随着Activity/Fragment的状态暂停、重放。Glide 的缓存在gif这里也是一样,调整大小然后缓存。
除了gif动画之外,Glide还可以将任意本地视频解码成一张静态图片。
还有一个特性是你可以配置图片显示的动画,而Picasso只有一种动画:fading in。
最后一个是可以使用thumbnail()产生一个你所加载图片的thumbnail。
有许多可以配置的选项,比如大小,缓存的磁盘位置,最大缓存空间,位图格式等等。可以在这个页面查看这些配置 Configuration 。
6两者的大局比较:
依赖包大小 方法数量 速度 OutOfMemoryError
Picasso 118kb 840
Glide 430kb 2678 更快 更少
JAVA中最多65535个方法!
########################Glide-transformations ##########
推特提供的一个针对Glide特效动画库:
下载地址:https://github.com/wasabeef/glide-transformations
How do I use it?
Step 1
Gradle
repositories {
jcenter()
mavenCentral() // GPUImage for Android
}
dependencies {
compile 'jp.wasabeef:glide-transformations:2.0.1'
// If you want to use the GPU Filters
compile 'jp.co.cyberagent.android.gpuimage:gpuimage-library:1.3.0'
}
Step 2
Set Glide Transform.
Glide.with(this).load(R.drawable.demo)
.bitmapTransform(new BlurTransformation(context))
.into((ImageView) findViewById(R.id.image));
Advanced Step 3
You can set a multiple transformations.
Glide.with(this).load(R.drawable.demo)
.bitmapTransform(new BlurTransformation(context, 25), new CropCircleTransformation(context))
.into((ImageView) findViewById(R.id.image));
Transformations
Crop
CropTransformation, CropCircleTransformation, CropSquareTransformation, RoundedCornersTransformation
Color
ColorFilterTransformation, GrayscaleTransformation
Blur
BlurTransformation
Mask
MaskTransformation
GPU Filter (use GPUImage)
Will require add dependencies for GPUImage.
ToonFilterTransformation, SepiaFilterTransformation, ContrastFilterTransformation
InvertFilterTransformation, PixelationFilterTransformation, SketchFilterTransformation
SwirlFilterTransformation, BrightnessFilterTransformation, KuwaharaFilterTransformation VignetteFilterTransformation