轉(zhuǎn)自http://www.reibang.com/p/02da487a2f43
近年來,圖片高斯模糊備受設(shè)計(jì)師的青睞透乾,在各大知名APP中侠仇,如微信、手機(jī)QQ筑累、網(wǎng)易云音樂等等都有對(duì)背景高斯圖模糊的設(shè)計(jì)畏妖,在Adnroid 中,現(xiàn)在常用的圖片高斯模糊技術(shù)有三種:RenderScript 疼阔、fastBlur、對(duì)RenderScript和fastBlur的優(yōu)化,接下來分別分析各自的優(yōu)缺點(diǎn)和在項(xiàng)目中該使用哪個(gè)解決方案婆廊。先上一張效果圖:
1迅细,RenderScript
RenderScript是在Android上的高性能運(yùn)行密集型運(yùn)算的框架,RenderScript主要用于數(shù)據(jù)并行計(jì)算淘邻,尤其對(duì)圖像處理茵典、攝影分析和計(jì)算機(jī)視覺特別有用。RenderScript是在Android3.0(API 11)引入的宾舅。而Android圖片高斯模糊處理统阿,通常也是用這個(gè)庫來完成。它提供了我們Java層調(diào)用的API,實(shí)際上是在c/c++ 層來處理的筹我,所以它的效率和性能通常是最高的扶平。要使用RenderScript完成圖片高斯模糊只需要以下幾步:
(1) 初始化一個(gè)RenderScript Context:RenderScript 上下文環(huán)境通過create(Context)
方法來創(chuàng)建,它保證RenderScript的使用并且提供一個(gè)控制后續(xù)所有RenderScript對(duì)象(如:ScriptIntrinsicBlur蔬蕊、Allocation等)生命周期的對(duì)象结澄。
(2)通過Script至少創(chuàng)建一個(gè)Allocation:一個(gè)Allocation是提供存儲(chǔ)大量可變數(shù)據(jù)的RenderScript 對(duì)象。在內(nèi)核中岸夯,Allocation作為輸入和輸出麻献,在內(nèi)核中通過rsGetElementAt_type ()
和rsSetElementAt_type()
方法來訪問Allocation當(dāng)script全局綁定的時(shí)候。使用createFromBitmap
和createTyped
來創(chuàng)建Allocation猜扮。
(3)創(chuàng)建ScriptIntrinsic:它內(nèi)置了RenderScript 的一些通用操作勉吻,如高斯模糊、扭曲變換旅赢、圖像混合等等齿桃,更多的操作請(qǐng)看ScriptIntrinsic
的子類,本文要用的高斯模糊處理就是用的它的子類ScriptIntrinsicBlur
鲜漩。
(4)填充數(shù)據(jù)到Allocations:除了使用方法createFromBitmap
創(chuàng)建的Allocation外源譬,其它的第一次創(chuàng)建時(shí)都是填充的空數(shù)據(jù)。
(5)** 設(shè)置模糊半徑**:設(shè)置一個(gè)模糊的半徑,其值為 0-25孕似。
(6) 啟動(dòng)內(nèi)核踩娘,調(diào)用方法處理:調(diào)用forEach 方法模糊處理。
(7) ** 從Allocation 中拷貝數(shù)據(jù)**:為了能在Java層訪問Allocation的數(shù)據(jù)喉祭,用Allocation其中一個(gè)copy
方法來拷貝數(shù)據(jù)养渴。
(8) 銷毀RenderScript對(duì)象:可以用destroy
方法來銷毀RenderScript對(duì)象或者讓它可以被垃圾回收,destroy 之后泛烙,就能在用它控制的RenderScript對(duì)象了(比如在銷毀了之后理卑,再調(diào)用ScriptIntrinsic或者Allocation的方法是要拋異常的)。
以上幾個(gè)步驟就可以完成的圖片的高斯模糊蔽氨,看一下對(duì)應(yīng)的代碼:
private static Bitmap rsBlur(Context context,Bitmap source,int radius){
Bitmap inputBmp = source;
//(1)
RenderScript renderScript = RenderScript.create(context);
Log.i(TAG,"scale size:"+inputBmp.getWidth()+"*"+inputBmp.getHeight());
// Allocate memory for Renderscript to work with
//(2)
final Allocation input = Allocation.createFromBitmap(renderScript,inputBmp);
final Allocation output = Allocation.createTyped(renderScript,input.getType());
//(3)
// Load up an instance of the specific script that we want to use.
ScriptIntrinsicBlur scriptIntrinsicBlur = ScriptIntrinsicBlur.create(renderScript, Element.U8_4(renderScript));
//(4)
scriptIntrinsicBlur.setInput(input);
//(5)
// Set the blur radius
scriptIntrinsicBlur.setRadius(radius);
//(6)
// Start the ScriptIntrinisicBlur
scriptIntrinsicBlur.forEach(output);
//(7)
// Copy the output to the blurred bitmap
output.copyTo(inputBmp);
//(8)
renderScript.destroy();
return inputBmp;
}
上面對(duì)應(yīng)的步驟已經(jīng)用序號(hào)標(biāo)出藐唠,代碼就十行左右帆疟,很簡(jiǎn)單。這就十Android提供給我們的可以處理圖片高斯模糊的庫宇立。性能比較好踪宠,因?yàn)槭窃赾/c++層做的處理。但是它只能在API 17或者更高的版本使用, 看一下文檔的說明:
如上圖妈嘹,紅框中標(biāo)記的ScriptIntrinsicBlur 是在API 17加入的柳琢,因此低版本的手機(jī)是用不了,為了能兼容低版本的手機(jī)润脸,我們還得探索其他方案柬脸。
RenderScript 兼容包:
所幸的是,Google 為了兼容低版本也可以用RenderScript毙驯,加了一個(gè)兼容包倒堕,android.support.v8.renderscript ,使用support.v8.renderscript
就能兼容到Android 2.3版本(API 9),現(xiàn)在市面上估計(jì)沒有比2.3版本還低的手機(jī)了(4.x 的手機(jī)都不多了)尔苦。使用兼容包和使用原生的RenderScript完全一樣涩馆,代碼還是上面的代碼。只是需要在app 的build.gradle添加如下的代碼
android {
compileSdkVersion 23
buildToolsVersion "23.0.3"
defaultConfig {
minSdkVersion 9
targetSdkVersion 19
// 使用support.v8.renderscript
renderscriptTargetApi 18
renderscriptSupportModeEnabled true
}
}
只要添加上面的2行代碼就行了允坚。但是有2點(diǎn)需要注意:
注意:
1魂那,Android SDK Tools revision 22.2 or higher(Tools 需要22.2或者更高的版本)
2,Android SDK Build-tools revision 18.1.0 or higher( Build-tools 需要18.1.0或者更高的版本)
如果沒有達(dá)到的話稠项,通過Anroid SDK Manager 更新安裝涯雅。
有了兼容包,那么RenderScript就是一個(gè)完美的解決方案了嗎展运?答案是NO,還有2個(gè)缺點(diǎn):
- 雖然RenderScript效率不錯(cuò)活逆,但是處理尺寸大一點(diǎn)的圖片還是達(dá)不到16ms每一幀,需要優(yōu)化
- 雖然兼容包能解決API17以下不能使用的問題拗胜,但是引入兼容包又帶來了新的問題蔗候,APK 的包大小增大了,support.v8.renderscript有160k,現(xiàn)在各家的APP都在要求APK瘦身埂软,對(duì)于那種本來就很大的APK來說還是不能接受的锈遥。
因此我們還要找一下其他方案,接下來看一下fastBlur算法勘畔。
2所灸,fastBlur
fastBlur 是除了RenderScript 之外的另一種方法,它直接在Java層做圖片的模糊處理炫七。對(duì)每個(gè)像素點(diǎn)應(yīng)用高斯模糊計(jì)算爬立、最后在合成Bitmap。請(qǐng)看源碼:
/**
* Stack Blur v1.0 from
* http://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html
* Java Author: Mario Klingemann <mario at quasimondo.com>
* http://incubator.quasimondo.com
*
* created Feburary 29, 2004
* Android port : Yahel Bouaziz <yahel at kayenko.com>
* http://www.kayenko.com
* ported april 5th, 2012
*
* This is a compromise between Gaussian Blur and Box blur
* It creates much better looking blurs than Box Blur, but is
* 7x faster than my Gaussian Blur implementation.
*
* I called it Stack Blur because this describes best how this
* filter works internally: it creates a kind of moving stack
* of colors whilst scanning through the image. Thereby it
* just has to add one new block of color to the right side
* of the stack and remove the leftmost color. The remaining
* colors on the topmost layer of the stack are either added on
* or reduced by one, depending on if they are on the right or
* on the left side of the stack.
*
* If you are using this algorithm in your code please add
* the following line:
* Stack Blur Algorithm by Mario Klingemann <mario@quasimondo.com>
*/
private static Bitmap fastBlur(Bitmap sentBitmap, float scale, int radius) {
int width = Math.round(sentBitmap.getWidth() * scale);
int height = Math.round(sentBitmap.getHeight() * scale);
sentBitmap = Bitmap.createScaledBitmap(sentBitmap, width, height, false);
Bitmap bitmap = sentBitmap.copy(sentBitmap.getConfig(), true);
if (radius < 1) {
return (null);
}
int w = bitmap.getWidth();
int h = bitmap.getHeight();
int[] pix = new int[w * h];
Log.e("pix", w + " " + h + " " + pix.length);
bitmap.getPixels(pix, 0, w, 0, 0, w, h);
int wm = w - 1;
int hm = h - 1;
int wh = w * h;
int div = radius + radius + 1;
int r[] = new int[wh];
int g[] = new int[wh];
int b[] = new int[wh];
int rsum, gsum, bsum, x, y, i, p, yp, yi, yw;
int vmin[] = new int[Math.max(w, h)];
int divsum = (div + 1) >> 1;
divsum *= divsum;
int dv[] = new int[256 * divsum];
for (i = 0; i < 256 * divsum; i++) {
dv[i] = (i / divsum);
}
yw = yi = 0;
int[][] stack = new int[div][3];
int stackpointer;
int stackstart;
int[] sir;
int rbs;
int r1 = radius + 1;
int routsum, goutsum, boutsum;
int rinsum, ginsum, binsum;
for (y = 0; y < h; y++) {
rinsum = ginsum = binsum = routsum = goutsum = boutsum = rsum = gsum = bsum = 0;
for (i = -radius; i <= radius; i++) {
p = pix[yi + Math.min(wm, Math.max(i, 0))];
sir = stack[i + radius];
sir[0] = (p & 0xff0000) >> 16;
sir[1] = (p & 0x00ff00) >> 8;
sir[2] = (p & 0x0000ff);
rbs = r1 - Math.abs(i);
rsum += sir[0] * rbs;
gsum += sir[1] * rbs;
bsum += sir[2] * rbs;
if (i > 0) {
rinsum += sir[0];
ginsum += sir[1];
binsum += sir[2];
} else {
routsum += sir[0];
goutsum += sir[1];
boutsum += sir[2];
}
}
stackpointer = radius;
for (x = 0; x < w; x++) {
r[yi] = dv[rsum];
g[yi] = dv[gsum];
b[yi] = dv[bsum];
rsum -= routsum;
gsum -= goutsum;
bsum -= boutsum;
stackstart = stackpointer - radius + div;
sir = stack[stackstart % div];
routsum -= sir[0];
goutsum -= sir[1];
boutsum -= sir[2];
if (y == 0) {
vmin[x] = Math.min(x + radius + 1, wm);
}
p = pix[yw + vmin[x]];
sir[0] = (p & 0xff0000) >> 16;
sir[1] = (p & 0x00ff00) >> 8;
sir[2] = (p & 0x0000ff);
rinsum += sir[0];
ginsum += sir[1];
binsum += sir[2];
rsum += rinsum;
gsum += ginsum;
bsum += binsum;
stackpointer = (stackpointer + 1) % div;
sir = stack[(stackpointer) % div];
routsum += sir[0];
goutsum += sir[1];
boutsum += sir[2];
rinsum -= sir[0];
ginsum -= sir[1];
binsum -= sir[2];
yi++;
}
yw += w;
}
for (x = 0; x < w; x++) {
rinsum = ginsum = binsum = routsum = goutsum = boutsum = rsum = gsum = bsum = 0;
yp = -radius * w;
for (i = -radius; i <= radius; i++) {
yi = Math.max(0, yp) + x;
sir = stack[i + radius];
sir[0] = r[yi];
sir[1] = g[yi];
sir[2] = b[yi];
rbs = r1 - Math.abs(i);
rsum += r[yi] * rbs;
gsum += g[yi] * rbs;
bsum += b[yi] * rbs;
if (i > 0) {
rinsum += sir[0];
ginsum += sir[1];
binsum += sir[2];
} else {
routsum += sir[0];
goutsum += sir[1];
boutsum += sir[2];
}
if (i < hm) {
yp += w;
}
}
yi = x;
stackpointer = radius;
for (y = 0; y < h; y++) {
// Preserve alpha channel: ( 0xff000000 & pix[yi] )
pix[yi] = ( 0xff000000 & pix[yi] ) | ( dv[rsum] << 16 ) | ( dv[gsum] << 8 ) | dv[bsum];
rsum -= routsum;
gsum -= goutsum;
bsum -= boutsum;
stackstart = stackpointer - radius + div;
sir = stack[stackstart % div];
routsum -= sir[0];
goutsum -= sir[1];
boutsum -= sir[2];
if (x == 0) {
vmin[y] = Math.min(y + r1, hm) * w;
}
p = x + vmin[y];
sir[0] = r[p];
sir[1] = g[p];
sir[2] = b[p];
rinsum += sir[0];
ginsum += sir[1];
binsum += sir[2];
rsum += rinsum;
gsum += ginsum;
bsum += binsum;
stackpointer = (stackpointer + 1) % div;
sir = stack[stackpointer];
routsum += sir[0];
goutsum += sir[1];
boutsum += sir[2];
rinsum -= sir[0];
ginsum -= sir[1];
binsum -= sir[2];
yi += w;
}
}
Log.e("pix", w + " " + h + " " + pix.length);
bitmap.setPixels(pix, 0, w, 0, 0, w, h);
return (bitmap);
}
如上所示万哪,就一個(gè)方法,使用這種方式不會(huì)有兼容性問題侠驯,也不會(huì)引入jar包導(dǎo)致APK變大抡秆。但是這種方法的效率是非常低的,想想也知道吟策,因?yàn)槭窃贘ava 層處理琅轧,速度當(dāng)然慢。測(cè)試了一張800 x 450 的圖片,RenderScript平均25 ms 左右踊挠,fastBlur平均310ms 左右,相當(dāng)于差了10倍冲杀。還有就是使用這種方式是把圖片全部加載到內(nèi)存效床,如果圖片較大,容易導(dǎo)致OOM权谁。
3剩檀,對(duì)RenderScript 和fastBlur 的優(yōu)化
上面對(duì)RenderScript 和fastBlur做了分析,雖然RenderScript的效率要比fastBlur 好很多旺芽,但是還是有可能達(dá)不到16ms每一幀的要求而導(dǎo)致卡頓沪猴。所以需要進(jìn)行優(yōu)化。
思路: 在stackOverFlow上有提供優(yōu)化思路(地址:http://stackoverflow.com/questions/2067955/fast-bitmap-blur-for-android-sdk)
,原理是這樣的:通過縮小圖片采章,使其丟失一些像素點(diǎn)运嗜,接著進(jìn)行模糊化處理,然后再放大到原來尺寸悯舟。由于圖片縮小后再進(jìn)行模糊處理担租,需要處理的像素點(diǎn)和半徑都變小,從而使得模糊處理速度加快抵怎。
因此我們只需要將原來的圖片縮小奋救,然后在用RenderScript 或者fastBlur 處理,就可以加快速度了反惕,添加如下代碼:
int width = Math.round(source.getWidth() * scale);
int height = Math.round(source.getHeight() * scale);
Bitmap inputBmp = Bitmap.createScaledBitmap(source,width,height,false);
renderScript 高斯模糊的完整方法如下:
private static Bitmap rsBlur(Context context,Bitmap source,int radius,float scale){
Log.i(TAG,"origin size:"+source.getWidth()+"*"+source.getHeight());
int width = Math.round(source.getWidth() * scale);
int height = Math.round(source.getHeight() * scale);
Bitmap inputBmp = Bitmap.createScaledBitmap(source,width,height,false);
RenderScript renderScript = RenderScript.create(context);
Log.i(TAG,"scale size:"+inputBmp.getWidth()+"*"+inputBmp.getHeight());
// Allocate memory for Renderscript to work with
final Allocation input = Allocation.createFromBitmap(renderScript,inputBmp);
final Allocation output = Allocation.createTyped(renderScript,input.getType());
// Load up an instance of the specific script that we want to use.
ScriptIntrinsicBlur scriptIntrinsicBlur = ScriptIntrinsicBlur.create(renderScript, Element.U8_4(renderScript));
scriptIntrinsicBlur.setInput(input);
// Set the blur radius
scriptIntrinsicBlur.setRadius(radius);
// Start the ScriptIntrinisicBlur
scriptIntrinsicBlur.forEach(output);
// Copy the output to the blurred bitmap
output.copyTo(inputBmp);
renderScript.destroy();
return inputBmp;
}
先對(duì)Bitmap 縮小尝艘,然后再模糊處理。
Note:縮小的系數(shù)應(yīng)該為2的整數(shù)次冪 姿染,即上面代碼中的scale應(yīng)該為1/2背亥、1/4、1/8 ... 參考BitmapFactory.Options 對(duì)圖片縮放 的inSample系數(shù)盔粹。據(jù)前輩們經(jīng)驗(yàn)隘梨,一般scale = 1/8 為佳。
看一下使用RenderScript和fastBlur 以及優(yōu)化后舷嗡,高斯模糊一張圖片所花時(shí)間的對(duì)比表轴猎,測(cè)試機(jī)型為魅族metal,系統(tǒng)為Android 5.1,如下:
如上圖:以1080 x 1349 的圖片為例(每一個(gè)半徑取5次的均值),使用原尺寸用兩種方法進(jìn)行高斯模糊进萄,RenderScript的效率比fastBlur高捻脖,大約快10倍锐峭,但是都超過了16ms,而使用優(yōu)化方法后可婶,使其先縮小8倍沿癞,再模糊,2種方法效率都有質(zhì)的提高矛渴,RenderScript模糊時(shí)間不足5ms椎扬,fastBlur 也接近16ms,半徑為15以下小與16ms具温。
因此不管使用哪種方法模糊圖片蚕涤,都應(yīng)該先優(yōu)化,再模糊铣猩。
4揖铜,優(yōu)缺點(diǎn)比較及圖片高斯模糊方案
RenderScript 優(yōu)點(diǎn):
- 使用簡(jiǎn)單,原生的API达皿,十行左右的代碼就能完成高斯模糊
- 效率較高天吓,是在c/c++層做處理
RenderScript 缺點(diǎn):
- API 17以上才能使用
- 用兼容包的話,會(huì)導(dǎo)致APK 體積增大峦椰,support包約160k
fastBlur的優(yōu)點(diǎn):
- 沒有兼容版本問題
- 不用引入三方包龄寞,不會(huì)增加APK大小
fastBlur的缺點(diǎn):
- 效率很低,在Java層做處理
- 將Bitmap全部加載到內(nèi)存们何,較大圖片容易OOM
以上對(duì)比了2種方法的優(yōu)缺點(diǎn)萄焦,各有優(yōu)劣,那么我們到底選擇哪一種呢冤竹?這個(gè)需要看情況而定拂封,給出下面2種方案:
高斯模糊方案一: 如果APK本身較小,可以接受增大的160k體積鹦蠕,那么直接使用兼容包的RenderScript (注意需要先優(yōu)化冒签,用上面的先縮小再模糊)。
高斯模糊方案二:如果不想APK體積增大钟病,那么在模糊的時(shí)候做判斷, API版本大于17 萧恕,直接使用原生的RenderScript模糊,API版本小于17,則用fastBlur方法肠阱。(同樣需要先優(yōu)化票唆,后模糊)。
6,輪子
由于高斯模糊在項(xiàng)目中用得比較多屹徘,而每一個(gè)項(xiàng)目都去拷貝代碼走趋,這樣很麻煩,并且不優(yōu)雅噪伊,因此簿煌,對(duì)這兩種方法優(yōu)化后氮唯,封裝成了一個(gè)Lib,要使用時(shí)直接添加依賴就行。
添加依賴:
1, 最外層build.gradle 添加一下代碼:
allprojects {
repositories {
jcenter()
maven {url "https://jitpack.io"}
}
}
2姨伟,app 的build.gradle添加:
dependencies {
compile 'com.github.pinguo-zhouwei:EasyBlur:v1.0.0'
}
3,app 的build.gradle添加:
defaultConfig {
applicationId "com.zhouwei.easyblur"
minSdkVersion 16
targetSdkVersion 25
versionCode 1
versionName "1.0"
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
//使用renderscript 兼容包
renderscriptTargetApi 25
renderscriptSupportModeEnabled true
}
使用方法:
1惩琉,簡(jiǎn)單使用,指定Bitmap和半徑
Bitmap finalBitmap = EasyBlur.with(MainActivity.this)
.bitmap(overlay) //要模糊的圖片
.radius(10)//模糊半徑
.blur();
2,可以指定縮小的倍數(shù)夺荒,默認(rèn)縮小倍數(shù)為8
Bitmap finalBitmap = EasyBlur.with(MainActivity.this)
.bitmap(overlay) //要模糊的圖片
.radius(10)//模糊半徑
.scale(4)//指定模糊前縮小的倍數(shù)
.blur();
3, 指定使用哪一種方法,默認(rèn)是使用兼容的RenderScript 高斯模糊
Bitmap finalBitmap = EasyBlur.with(MainActivity.this)
.bitmap(overlay) //要模糊的圖片
.radius(10)//模糊半徑
.scale(4)//指定模糊前縮小的倍數(shù)
.policy(EasyBlur.BlurPolicy.FAST_BLUR)//使用fastBlur
.blur();
代碼已經(jīng)上傳Github:EasyBlur
參考資料
RenderScript API 指南
android圖片處理之圖像模糊
高斯模糊實(shí)現(xiàn)方案探究
Fast Bitmap Blur For Android SDK