因?yàn)閯討B(tài)的webp使用的也越來越多了,所以這里記錄一種加載處理的辦法。目前常用的Android圖片加載庫,只有fresco是可以直接加載animated webp的。那么如何處理呢?記錄一下,不然坑都白踩了。本質(zhì)上webp和gif都是一組圖片組成的連續(xù)圖片,如果要單獨(dú)解析每一幀怎么辦呢。
Android支持
如果要拿到webp的第一幀,在Android以上是可以直接使用如下這種方法,默認(rèn)取的是第一幀,但是,這種方法只有在8.0及以上才有用。
Bitmap bitmap = BitmapFactory.decodeFile(filename);
fresco控制animated webp
添加fresco支持webp的方法是:
implementation 'com.facebook.fresco:fresco:1.13.0'
implementation 'com.facebook.fresco:webpsupport:1.13.0'
//implementation 'com.facebook.fresco:animated-gif:1.13.0'
添加之后就可以直接加載webp了,也可以設(shè)置自動開始播放,如下:
ImageRequestBuilder imageRequestBuilder = ImageRequestBuilder.newBuilderWithSource(uri);
PipelineDraweeControllerBuilder builder = Fresco.newDraweeControllerBuilder();
builder.setImageRequest(imageRequestBuilder.build());
builder.setAutoPlayAnimations(true);
builder.setControllerListener(new BaseControllerListener<ImageInfo>() {
@Override
public void onFinalImageSet(String id, ImageInfo imageInfo, Animatable animatable) {
//加載完成的監(jiān)聽
}
});
simpleDraweeView.setController(builder.build());
到這一步都很簡單,但是要加載webp的第一幀咋辦呢?
先來一種最簡單的,類似于BitmapFactory.decodeFile(),fresco中也有一個方法,同樣的,這種方法也是僅支持8.0及以上
Bitmap bitmap = WebpSupportStatus
.loadWebpBitmapFactoryIfExists()
.decodeFile(filename, new BitmapFactory.Options());
那么還有什么辦法呢?還可以使用下面這種方法。這種方法是用的是fresco的訂閱者,可以處理加載之后的數(shù)據(jù),可以拿到webp的每一幀,然后做你想要的處理,官網(wǎng)鏈接。
ImageDecodeOptionsBuilder decodeOptionsBuilder = new ImageDecodeOptionsBuilder();
decodeOptionsBuilder.setDecodeAllFrames(true);
decodeOptionsBuilder.setBitmapConfig(Bitmap.Config.ARGB_8888);
ImagePipelineFactory.getInstance()
.getImagePipeline()
.fetchDecodedImage(ImageRequestBuilder
.newBuilderWithSource(Uri.fromFile(new File(filename)))
.setImageDecodeOptions(new ImageDecodeOptions(decodeOptionsBuilder))
.build()
, context)
.subscribe(new BaseDataSubscriber<CloseableReference<CloseableImage>>() {
@Override
protected void onNewResultImpl(DataSource<CloseableReference<CloseableImage>> dataSource) {
if (dataSource.getResult().get() instanceof CloseableAnimatedImage) {
CloseableAnimatedImage animatedImage = (CloseableAnimatedImage) dataSource.getResult().get();
if (animatedImage.getImage().getFrameCount() > 0) {
Bitmap frameBitmap = Bitmap.createBitmap(animatedImage.getWidth(), animatedImage.getHeight(), Bitmap.Config.ARGB_8888);
//添加透明通道
frameBitmap.eraseColor(Color.TRANSPARENT);
frameBitmap.setHasAlpha(true);
animatedImage.getImage().getFrame(0).renderFrame(animatedImage.getWidth(), animatedImage.getHeight(), frameBitmap);
try {
//保存成文件
File file = new File(filename);
File outFile = new File(file.getParent(), file.getName() + ".png");
FileOutputStream out = new FileOutputStream(outFile);
frameBitmap.compress(Bitmap.CompressFormat.PNG, 100, out);
out.flush();
out.close();
} catch (FileNotFoundException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
@Override
protected void onFailureImpl(DataSource<CloseableReference<CloseableImage>> dataSource) {
}
}, CallerThreadExecutor.getInstance());
需要注意的地方有三個:
- 下面這種方法默認(rèn)解出來的bitmap是不帶透明通道的,需要你處理一遍。
- 第二個是,這種方法拿到的bitmap離開這個方法之后就有可能會被回收掉,如果你要長久使用的話,建議自己再copy一遍,我為了節(jié)省解壓的時間,我直接保存成為一張png的文件,然后去使用,你也可以直接copy出來bitmap去使用的。
- 這種方法可以解壓出來每一幀,選擇你需要幀數(shù)來處理就可以了。
Glide4控制GIF
關(guān)于GIF,目前支持的主流的加載庫只有Glide和fresco,Picasso并不默認(rèn)支持。
在這里順便記錄一下Glide4.0加載Gif的并控制播放的方式。在Glide3中GlideDrawableImageViewTarget已經(jīng)被廢棄了,可以使用GifDrawable來控制,里面有控制GIF的方法,也可以拿到GIF的每一幀來處理,定義好的接口方法就在那里,不離不棄,看下接口就知道了。
public void setStartPlayGif(final boolean startPlayGif) {
Glide.with(context)
.asGif()
.load("gifFile")
.into(new ImageViewTarget<GifDrawable>(imageView) {
@Override
protected void setResource(@Nullable GifDrawable resource) {
if (resource != null) {
if(startPlayGif){
//resource.setLoopCount(1);
view.setImageDrawable(resource);
} else {
view.setImageBitmap(resource.getFirstFrame());
}
}
}
});
}