这篇文章将为大家详细讲解有关Android如何实现局部模糊效果,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
具体内容如下
要实现模糊或者毛玻璃效果,使用PS自然最方便(模糊的区域就较为固定);
也可在代码里进行动态处理。
因为要模糊的区域并不固定,所以只能琢磨一下后者;
经过一番搜寻研究,得到两种切实可行的方法。
一、使用FastBlur;
二、使用RenderScript。
效果如下:
算法
1.FastBlur
/** * 高斯模糊 * * @param srcBitmap * 源位图 * @param radius * 模糊半径 * @return bitmap */ public static Bitmap blurByGauss(Bitmap srcBitmap, int radius) { Bitmap bitmap = srcBitmap.copy(srcBitmap.getConfig(), true); if (radius < 1) { return (null); } int w = bitmap.getWidth(); int h = bitmap.getHeight(); int[] pix = new int[w * h]; 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 temp = 256 * divsum; int dv[] = new int[temp]; for (i = 0; i < temp; 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++) { 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; } } bitmap.setPixels(pix, 0, w, 0, 0, w, h); return bitmap; }
这种算法是直接对像素进行处理,使用java写会慢一些,懂jni的话可以用C/C++写下,效率高一些。
2. RenderScript
/** * RenderScript模糊 * * @param context * 上下文 * @param bitmap * 源位图 * @param radius * 模糊半径 * @return bitmap */ @SuppressLint("NewApi") public static Bitmap blurBitmapByRender(Context context, Bitmap bitmap, float radius) { Bitmap outBitmap = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Config.ARGB_8888); RenderScript rs = RenderScript.create(context); ScriptIntrinsicBlur blurScript = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs)); Allocation allIn = Allocation.createFromBitmap(rs, bitmap); Allocation allOut = Allocation.createFromBitmap(rs, outBitmap); blurScript.setRadius(radius); blurScript.setInput(allIn); blurScript.forEach(allOut); allOut.copyTo(outBitmap); bitmap.recycle(); rs.destroy(); return outBitmap; }
实现
整个例子就两个步骤:
一、为整体布局LayoutA设置背景图A;
二、为局部布局LayoutB设置经过模糊处理的背景图B。
需要注意的是,背景图B是从背景图A中截取出来的,并且经过模糊处理。
细分下来有以下几个步骤:
1.搭建整体布局,在xml中设置整体布局的背景图;
布局如下:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/rl_bg_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/bg" tools:context="${relativePackage}.${activityClass}" > <LinearLayout android:id="@+id/ll_blur_layout" android:layout_width="match_parent" android:layout_height="150dp" android:layout_alignParentBottom="true" android:orientation="horizontal" > </LinearLayout> </RelativeLayout>
2.实例化布局控件,获取整体布局的显示内容;
要点一:这里要用到ViewTreeObserver, 是因为在onCreate方法中直接获取某控件的属性内容是得不到正确结果的(尚未完成绘制),所以采用ViewTreeObserver来进行监听;
要点二:获取一个控件的显示内容要用到getDrawingCache() ,使用BitmapFactory.decodeResource(getResources(), R.drawable.bg)得到是原图,并不是控件中显示的内容,控件中显示的内容是已经经过缩放适配了的;
代码如下:
public class BlurActivity extends Activity { /** * 整体布局 */ private RelativeLayout rlBgLayout; /** * 局部布局 */ private LinearLayout llBlurLayout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_blur); initView(); } protected void initView() { rlBgLayout = (RelativeLayout) findViewById(R.id.rl_bg_layout); llBlurLayout = (LinearLayout) findViewById(R.id.ll_blur_layout); setBlur(); } protected void setBlur() { ViewTreeObserver vto = rlBgLayout.getViewTreeObserver(); vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() { @Override public void onGlobalLayout() { // 保证只调用一次 rlBgLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this); // 组件生成cache(组件显示内容) rlBgLayout.buildDrawingCache(); // 得到组件显示内容 Bitmap bitmap = rlBgLayout.getDrawingCache(); // 局部模糊处理 BitmapUtils.blur(getApplicationContext(), bitmap, llBlurLayout, 5); } }); } }
3.根据整体布局与局部布局的大小获取要进行模糊处理的内容;
要点一:结合Bitmap.createBitmap和Canvas来获取正确的坐标和大小;
要点二:这里只需要知道局部布局的位置与大小即可,整体布局的背景图作为bitmap,局部布局作为view,可得到局部布局所在坐标为:(x,y)=(view.getLeft(),view.getLeft()),其大小为(w,h)=(view.getMeasuredWidth(),view.getMeasuredHeight())。再根据Canvas的位移函数translate与绘图函数drawBitmap即可从整体布局的背景图中截取到被局部布局覆盖的位图;
/** * 得到待处理的位图 * * @param bitmap * 模糊位图 * @param view * 模糊区域 * @return bitmap */ public static Bitmap getDstArea(Bitmap bitmap, View view) { Bitmap dstArea = Bitmap.createBitmap((int) (view.getMeasuredWidth()), (int) (view.getMeasuredHeight()), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(dstArea); canvas.translate(-view.getLeft(), -view.getTop()); canvas.drawBitmap(bitmap, 0, 0, null); return dstArea; }
4.进行模糊处理,为局部布局设置背景图;
要点一:有两种方法,即上文说的两种算法,一种直接高斯计算像素FastBlur,一种利用RenderScript;
要点二:FastBlur相对慢一些,不过兼容性较好,支持所有版本;RenderScript则只支持17以上的SDK;
要点三:为了减少处理时间、提高处理效率,可以先将位图进行一定的压缩,然后再作模糊处理;
/** * 高斯局部模糊 * * @param context * 上下文 * @param bitmap * 模糊位图 * @param view * 模糊区域 * @param radius * 模糊半径 */ public static void blurByGauss(Context context, Bitmap bitmap, View view, float radius) { // 得到要处理的区域 Bitmap dstArea = getDstArea(bitmap, view); // 作模糊处理 dstArea = blurByGauss(zoomImage(dstArea, 0.8f), (int) radius); // 设置背景 view.setBackground(new BitmapDrawable(context.getResources(), dstArea)); bitmap.recycle(); } /** * RenderScript局部模糊 * * @param context * 上下文 * @param bitmap * 模糊位图 * @param view * 模糊区域 * @param radius * 模糊半径 */ @SuppressLint("NewApi") public static void blurByRender(Context context, Bitmap bitmap, View view, float radius) { // 得到要处理的区域 Bitmap dstArea = getDstArea(bitmap, view); dstArea = zoomImage(dstArea, 0.8f); // 作模糊处理 RenderScript rs = RenderScript.create(context); Allocation overlayAlloc = Allocation.createFromBitmap(rs, dstArea); ScriptIntrinsicBlur blur = ScriptIntrinsicBlur.create(rs, overlayAlloc.getElement()); blur.setInput(overlayAlloc); blur.setRadius(radius); blur.forEach(overlayAlloc); overlayAlloc.copyTo(dstArea); // 设置背景 view.setBackground(new BitmapDrawable(context.getResources(), dstArea)); bitmap.recycle(); rs.destroy(); } /** * 缩放图片 * * @param srcBitmap * 源图 * @param newWidth * 新宽 * @param newHeight * 新高 * @return bitmap */ public static Bitmap zoomImage(Bitmap srcBitmap, float scale) { // 获取这个图片的宽和高 float width = srcBitmap.getWidth(); float height = srcBitmap.getHeight(); // 创建操作图片用的matrix对象 Matrix matrix = new Matrix(); // 缩放图片动作 matrix.postScale(scale, scale); Bitmap bitmap = Bitmap.createBitmap(srcBitmap, 0, 0, (int) width, (int) height, matrix, true); return bitmap; }
关于“Android如何实现局部模糊效果”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。