Glide-----一个新的android图片处理开源项目_安卓图片处理开源-程序员宅基地

技术标签: android  android图片加载  glide  图片框架  

英文原文 Introduction to Glide, Image Loader Library for Android, recommended by Google

首发地址   http://jcodecraeer.com/a/anzhuokaifa/androidkaifa/2015/0327/2650.html

在泰国举行的谷歌开发者论坛上,谷歌为我们介绍了一个名叫 Glide 的图片加载库,作者是bumptech。这个库被广泛的运用在google的开源项目中,包括2014年google I/O大会上发布的官方app。

它的成功让我非常感兴趣。我花了一整晚的时间把玩,决定分享一些自己的经验。在开始之前我想说,Glide和Picasso有90%的相似度,准确的说,就是Picasso的克隆版本。但是在细节上还是有不少区别的。

导入库

Picasso和Glide都在jcenter上。在项目中添加依赖非常简单:

Picasso

[js]  view plain   copy
  1. dependencies {  
  2.     compile 'com.squareup.picasso:picasso:2.5.1'  
  3. }  

Glide

[js]  view plain   copy
  1. dependencies {  
  2.     compile 'com.github.bumptech.glide:glide:3.5.2'  
  3.     compile 'com.android.support:support-v4:22.0.0'  
  4. }  

Glide需要依赖Support Library v4,别忘了。其实Support Library v4已经是应用程序的标配了,这不是什么问题。

基础

就如我所说的Glide和Picasso非常相似,Glide加载图片的方法和Picasso如出一辙。

Picasso

[js]  view plain   copy
  1. Picasso.with(context)  
  2.     .load("http://inthecheesefactory.com/uploads/source/glidepicasso/cover.jpg")  
  3.     .into(ivImg);  

Glide

[js]  view plain   copy
  1. Glide.with(context)  
  2.     .load("http://inthecheesefactory.com/uploads/source/glidepicasso/cover.jpg")  
  3.     .into(ivImg);  

虽然两者看起来一样,但是Glide更易用,因为Glide的with方法不光接受Context,还接受Activity 和 Fragment,Context会自动的从他们获取。

with

同时将Activity/Fragment作为with()参数的好处是:图片加载会和Activity/Fragment的生命周期保持一致,比如Paused状态在暂停加载,在Resumed的时候又自动重新加载。所以我建议传参的时候传递Activity 和 Fragment给Glide,而不是Context。

默认Bitmap格式是RGB_565

下面是加载图片时和Picasso的比较(1920x1080 像素的图片加载到768x432的ImageView中)

firstload

可以看到Glide加载的图片质量要差于Picasso(ps:我看不出来哈),为什么?这是因为Glide默认的Bitmap格式是RGB_565 ,比ARGB_8888格式的内存开销要小一半。下面是Picasso在ARGB8888下与Glide在RGB565下的内存开销图(应用自身占用了8m,因此以8为基准线比较):

ram1_1

如果你对默认的RGB_565效果还比较满意,可以不做任何事,但是如果你觉得难以接受,可以创建一个新的GlideModule将Bitmap格式转换到ARGB_8888

[js]  view plain   copy
  1. public class GlideConfiguration implements GlideModule {  
  2.    
  3.     @Override  
  4.     public void applyOptions(Context context, GlideBuilder builder) {  
  5.         // Apply options to the builder here.  
  6.         builder.setDecodeFormat(DecodeFormat.PREFER_ARGB_8888);  
  7.     }  
  8.    
  9.     @Override  
  10.     public void registerComponents(Context context, Glide glide) {  
  11.         // register ModelLoaders here.  
  12.     }  
  13. }  

同时在AndroidManifest.xml中将GlideModule定义为meta-data


android:name="com.inthecheesefactory.lab.glidepicasso.GlideConfiguration" android:value="GlideModule"/>

quality2

这样看起来就会好很多。

我们再来看看内存开销图,这次貌似Glide花费了两倍于上次的内存,但是Picasso的内存开销仍然远大于Glide。

ram2_1

原因在于Picasso是加载了全尺寸的图片到内存,然后让GPU来实时重绘大小。而Glide加载的大小和ImageView的大小是一致的,因此更小。当然,Picasso也可以指定加载的图片大小的:

Picasso.with(this)  
    .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
    .resize(768, 432)  
    .into(ivImgPicasso);

但是问题在于你需要主动计算ImageView的大小,或者说你的ImageView大小是具体的值(而不是wrap_content),你也可以这样:

Picasso.with(this)  
    .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
    .fit()  
    .centerCrop()  
    .into(ivImgPicasso);

现在Picasso的内存开销就和Glide差不多了。

memory3

虽然内存开销差距不到,但是在这个问题上Glide完胜Picasso。因为Glide可以自动计算出任意情况下的ImageView大小。

Image质量的细节

这是将ImageView还原到真实大小时的比较。

quality3

你可以看到,Glide加载的图片没有Picasso那么平滑,我还没有找到一个可以直观改变图片大小调整算法的方法。

但是这并不算什么坏事,因为很难察觉。


磁盘缓存

Picasso和Glide在磁盘缓存策略上有很大的不同。Picasso缓存的是全尺寸的,而Glide缓存的是跟ImageView尺寸相同的。


cache

上面提到的平滑度的问题依然存在,而且如果加载的是RGB565图片,那么缓存中的图片也是RGB565。

我尝试将ImageView调整成不同大小,但不管大小如何Picasso只缓存一个全尺寸的。Glide则不同,它会为每种大小的ImageView缓存一次。尽管一张图片已经缓存了一次,但是假如你要在另外一个地方再次以不同尺寸显示,需要重新下载,调整成新尺寸的大小,然后将这个尺寸的也缓存起来。

具体说来就是:假如在第一个页面有一个200x200的ImageView,在第二个页面有一个100x100的ImageView,这两个ImageView本来是要显示同一张图片,却需要下载两次。

不过,你可以改变这种行为,让Glide既缓存全尺寸又缓存其他尺寸:

Glide.with(this)  
     .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
     .diskCacheStrategy(DiskCacheStrategy.ALL)  
     .into(ivImgGlide);

下次在任何ImageView中加载图片的时候,全尺寸的图片将从缓存中取出,重新调整大小,然后缓存。

Glide的这种方式优点是加载显示非常快。而Picasso的方式则因为需要在显示之前重新调整大小而导致一些延迟,即便你添加了这段代码来让其立即显示:

//Picasso  
.noFade();

loading3


Picasso和Glide各有所长,你根据自己的需求选择合适的。

对我而言,我更喜欢Glide,因为它远比Picasso快,虽然需要更大的空间来缓存。

quality2

这样看起来就会好很多。

我们再来看看内存开销图,这次貌似Glide花费了两倍于上次的内存,但是Picasso的内存开销仍然远大于Glide。

ram2_1

原因在于Picasso是加载了全尺寸的图片到内存,然后让GPU来实时重绘大小。而Glide加载的大小和ImageView的大小是一致的,因此更小。当然,Picasso也可以指定加载的图片大小的:

Picasso.with(this)  
    .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
    .resize(768, 432)  
    .into(ivImgPicasso);

但是问题在于你需要主动计算ImageView的大小,或者说你的ImageView大小是具体的值(而不是wrap_content),你也可以这样:

Picasso.with(this)  
    .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
    .fit()  
    .centerCrop()  
    .into(ivImgPicasso);

现在Picasso的内存开销就和Glide差不多了。

memory3

虽然内存开销差距不到,但是在这个问题上Glide完胜Picasso。因为Glide可以自动计算出任意情况下的ImageView大小。

Image质量的细节

这是将ImageView还原到真实大小时的比较。

quality3

你可以看到,Glide加载的图片没有Picasso那么平滑,我还没有找到一个可以直观改变图片大小调整算法的方法。

但是这并不算什么坏事,因为很难察觉。


磁盘缓存

Picasso和Glide在磁盘缓存策略上有很大的不同。Picasso缓存的是全尺寸的,而Glide缓存的是跟ImageView尺寸相同的。


cache

上面提到的平滑度的问题依然存在,而且如果加载的是RGB565图片,那么缓存中的图片也是RGB565。

我尝试将ImageView调整成不同大小,但不管大小如何Picasso只缓存一个全尺寸的。Glide则不同,它会为每种大小的ImageView缓存一次。尽管一张图片已经缓存了一次,但是假如你要在另外一个地方再次以不同尺寸显示,需要重新下载,调整成新尺寸的大小,然后将这个尺寸的也缓存起来。

具体说来就是:假如在第一个页面有一个200x200的ImageView,在第二个页面有一个100x100的ImageView,这两个ImageView本来是要显示同一张图片,却需要下载两次。

不过,你可以改变这种行为,让Glide既缓存全尺寸又缓存其他尺寸:

Glide.with(this)  
     .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
     .diskCacheStrategy(DiskCacheStrategy.ALL)  
     .into(ivImgGlide);

下次在任何ImageView中加载图片的时候,全尺寸的图片将从缓存中取出,重新调整大小,然后缓存。

Glide的这种方式优点是加载显示非常快。而Picasso的方式则因为需要在显示之前重新调整大小而导致一些延迟,即便你添加了这段代码来让其立即显示:

//Picasso  
.noFade();

loading3


Picasso和Glide各有所长,你根据自己的需求选择合适的。

对我而言,我更喜欢Glide,因为它远比Picasso快,虽然需要更大的空间来缓存。


特性

你可以做到几乎和Picasso一样多的事情,代码也几乎一样。

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)

几乎和Picasso一样,从Picasso转换到Glide对你来说就是小菜一碟。

有什么Glide可以做而Picasso做不到

Glide可以加在GIF动态图,而Picasso不能。

gifanimation2


同时因为Glide和Activity/Fragment的生命周期是一致的,因此gif的动画也会自动的随着Activity/Fragment的状态暂停、重放。Glide 的缓存在gif这里也是一样,调整大小然后缓存。

但是从我的一次测试结果来看Glide 动画会消费太多的内存,因此谨慎使用。

除了gif动画之外,Glide还可以将任何的本地视频解码成一张静态图片。

还有一个特性是你可以配置图片显示的动画,而Picasso只有一种动画:fading in。

最后一个是可以使用thumbnail()产生一个你所加载图片的thumbnail

其实还有一些特性,不过不是非常重要,比如将图像转换成字节数组等。

配置

有许多可以配置的选项,比如大小,缓存的磁盘位置,最大缓存空间,位图格式等等。可以在这个页面查看这些配置 Configuration

库的大小

Picasso (v2.5.1)的大小约118kb,而Glide (v3.5.2)的大小约430kb。

librarysize

Anyway 312KB difference might not be that significant.

不过312kb的差距并不是很重要。

Picasso和Glide的方法个数分别是840和2678个。

methodcount

必须指出,对于DEX文件65535个方法的限制来说,2678是一个相当大的数字了。建议在使用Glide的时候开启ProGuard。


总结

Glide和Picasso都是非常完美的库。Glide加载图像以及磁盘缓存的方式都要优于Picasso,速度更快,并且Glide更有利于减少OutOfMemoryError的发生,GIF动画是Glide的杀手锏。不过Picasso的图片质量更高。你更喜欢哪个呢?

虽然我使用了很长事件的Picasso,但是我得承认现在我更喜欢Glide。我的建议是使用Glide,但是将Bitmap格式换成 ARGB_8888、让Glide缓存同时缓存全尺寸和改变尺寸两种。

相关资源

Glide 3.0: a media management library for Android

Glide Wiki

Android Picasso vs Glide

Android: Image loading libraries Picasso vs Glide




[js]  view plain   copy
  1. quality2

这样看起来就会好很多。

我们再来看看内存开销图,这次貌似Glide花费了两倍于上次的内存,但是Picasso的内存开销仍然远大于Glide。

ram2_1

原因在于Picasso是加载了全尺寸的图片到内存,然后让GPU来实时重绘大小。而Glide加载的大小和ImageView的大小是一致的,因此更小。当然,Picasso也可以指定加载的图片大小的:

[js]  view plain   copy
  1. Picasso.with(this)  
  2.     .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
  3.     .resize(768, 432)  
  4.     .into(ivImgPicasso);  

但是问题在于你需要主动计算ImageView的大小,或者说你的ImageView大小是具体的值(而不是wrap_content),你也可以这样:

[js]  view plain   copy
  1. Picasso.with(this)  
  2.     .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
  3.     .fit()  
  4.     .centerCrop()  
  5.     .into(ivImgPicasso);  

现在Picasso的内存开销就和Glide差不多了。

memory3

虽然内存开销差距不到,但是在这个问题上Glide完胜Picasso。因为Glide可以自动计算出任意情况下的ImageView大小。

Image质量的细节

这是将ImageView还原到真实大小时的比较。

quality3

你可以看到,Glide加载的图片没有Picasso那么平滑,我还没有找到一个可以直观改变图片大小调整算法的方法。

但是这并不算什么坏事,因为很难察觉。


磁盘缓存

Picasso和Glide在磁盘缓存策略上有很大的不同。Picasso缓存的是全尺寸的,而Glide缓存的是跟ImageView尺寸相同的。


cache

上面提到的平滑度的问题依然存在,而且如果加载的是RGB565图片,那么缓存中的图片也是RGB565。

 

我尝试将ImageView调整成不同大小,但不管大小如何Picasso只缓存一个全尺寸的。Glide则不同,它会为每种大小的ImageView缓存一次。尽管一张图片已经缓存了一次,但是假如你要在另外一个地方再次以不同尺寸显示,需要重新下载,调整成新尺寸的大小,然后将这个尺寸的也缓存起来。

具体说来就是:假如在第一个页面有一个200x200的ImageView,在第二个页面有一个100x100的ImageView,这两个ImageView本来是要显示同一张图片,却需要下载两次。

不过,你可以改变这种行为,让Glide既缓存全尺寸又缓存其他尺寸:

[js]  view plain   copy
  1. Glide.with(this)  
  2.      .load("http://nuuneoi.com/uploads/source/playstore/cover.jpg")  
  3.      .diskCacheStrategy(DiskCacheStrategy.ALL)  
  4.      .into(ivImgGlide);  

下次在任何ImageView中加载图片的时候,全尺寸的图片将从缓存中取出,重新调整大小,然后缓存。

Glide的这种方式优点是加载显示非常快。而Picasso的方式则因为需要在显示之前重新调整大小而导致一些延迟,即便你添加了这段代码来让其立即显示:

[js]  view plain   copy
  1. //Picasso  
  2. .noFade();  

loading3


Picasso和Glide各有所长,你根据自己的需求选择合适的。

对我而言,我更喜欢Glide,因为它远比Picasso快,虽然需要更大的空间来缓存。

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/nnmmbb/article/details/50580577

智能推荐

while循环&CPU占用率高问题深入分析与解决方案_main函数使用while(1)循环cpu占用99-程序员宅基地

文章浏览阅读3.8k次,点赞9次,收藏28次。直接上一个工作中碰到的问题,另外一个系统开启多线程调用我这边的接口,然后我这边会开启多线程批量查询第三方接口并且返回给调用方。使用的是两三年前别人遗留下来的方法,放到线上后发现确实是可以正常取到结果,但是一旦调用,CPU占用就直接100%(部署环境是win server服务器)。因此查看了下相关的老代码并使用JProfiler查看发现是在某个while循环的时候有问题。具体项目代码就不贴了,类似于下面这段代码。​​​​​​while(flag) {//your code;}这里的flag._main函数使用while(1)循环cpu占用99

【无标题】jetbrains idea shift f6不生效_idea shift +f6快捷键不生效-程序员宅基地

文章浏览阅读347次。idea shift f6 快捷键无效_idea shift +f6快捷键不生效

node.js学习笔记之Node中的核心模块_node模块中有很多核心模块,以下不属于核心模块,使用时需下载的是-程序员宅基地

文章浏览阅读135次。Ecmacript 中没有DOM 和 BOM核心模块Node为JavaScript提供了很多服务器级别,这些API绝大多数都被包装到了一个具名和核心模块中了,例如文件操作的 fs 核心模块 ,http服务构建的http 模块 path 路径操作模块 os 操作系统信息模块// 用来获取机器信息的var os = require('os')// 用来操作路径的var path = require('path')// 获取当前机器的 CPU 信息console.log(os.cpus._node模块中有很多核心模块,以下不属于核心模块,使用时需下载的是

数学建模【SPSS 下载-安装、方差分析与回归分析的SPSS实现(软件概述、方差分析、回归分析)】_化工数学模型数据回归软件-程序员宅基地

文章浏览阅读10w+次,点赞435次,收藏3.4k次。SPSS 22 下载安装过程7.6 方差分析与回归分析的SPSS实现7.6.1 SPSS软件概述1 SPSS版本与安装2 SPSS界面3 SPSS特点4 SPSS数据7.6.2 SPSS与方差分析1 单因素方差分析2 双因素方差分析7.6.3 SPSS与回归分析SPSS回归分析过程牙膏价格问题的回归分析_化工数学模型数据回归软件

利用hutool实现邮件发送功能_hutool发送邮件-程序员宅基地

文章浏览阅读7.5k次。如何利用hutool工具包实现邮件发送功能呢?1、首先引入hutool依赖<dependency> <groupId>cn.hutool</groupId> <artifactId>hutool-all</artifactId> <version>5.7.19</version></dependency>2、编写邮件发送工具类package com.pc.c..._hutool发送邮件

docker安装elasticsearch,elasticsearch-head,kibana,ik分词器_docker安装kibana连接elasticsearch并且elasticsearch有密码-程序员宅基地

文章浏览阅读867次,点赞2次,收藏2次。docker安装elasticsearch,elasticsearch-head,kibana,ik分词器安装方式基本有两种,一种是pull的方式,一种是Dockerfile的方式,由于pull的方式pull下来后还需配置许多东西且不便于复用,个人比较喜欢使用Dockerfile的方式所有docker支持的镜像基本都在https://hub.docker.com/docker的官网上能找到合..._docker安装kibana连接elasticsearch并且elasticsearch有密码

随便推点

Python 攻克移动开发失败!_beeware-程序员宅基地

文章浏览阅读1.3w次,点赞57次,收藏92次。整理 | 郑丽媛出品 | CSDN(ID:CSDNnews)近年来,随着机器学习的兴起,有一门编程语言逐渐变得火热——Python。得益于其针对机器学习提供了大量开源框架和第三方模块,内置..._beeware

Swift4.0_Timer 的基本使用_swift timer 暂停-程序员宅基地

文章浏览阅读7.9k次。//// ViewController.swift// Day_10_Timer//// Created by dongqiangfei on 2018/10/15.// Copyright 2018年 飞飞. All rights reserved.//import UIKitclass ViewController: UIViewController { ..._swift timer 暂停

元素三大等待-程序员宅基地

文章浏览阅读986次,点赞2次,收藏2次。1.硬性等待让当前线程暂停执行,应用场景:代码执行速度太快了,但是UI元素没有立马加载出来,造成两者不同步,这时候就可以让代码等待一下,再去执行找元素的动作线程休眠,强制等待 Thread.sleep(long mills)package com.example.demo;import org.junit.jupiter.api.Test;import org.openqa.selenium.By;import org.openqa.selenium.firefox.Firefox.._元素三大等待

Java软件工程师职位分析_java岗位分析-程序员宅基地

文章浏览阅读3k次,点赞4次,收藏14次。Java软件工程师职位分析_java岗位分析

Java:Unreachable code的解决方法_java unreachable code-程序员宅基地

文章浏览阅读2k次。Java:Unreachable code的解决方法_java unreachable code

标签data-*自定义属性值和根据data属性值查找对应标签_如何根据data-*属性获取对应的标签对象-程序员宅基地

文章浏览阅读1w次。1、html中设置标签data-*的值 标题 11111 222222、点击获取当前标签的data-url的值$('dd').on('click', function() { var urlVal = $(this).data('ur_如何根据data-*属性获取对应的标签对象

推荐文章

热门文章

相关标签