Android 高仿微信语音聊天页面高斯模糊(毛玻璃效果)

Android 高仿微信语音聊天页面高斯模糊(毛玻璃效果),第1张

概述目前的应用市场上,使用毛玻璃效果的APP随处可见,比如用过微信语音聊天的人可以发现,语音聊天页面就使用了高斯模糊效果。

目前的应用市场上,使用毛玻璃效果的APP随处可见,比如用过微信语音聊天的人可以发现,语音聊天页面就使用了高斯模糊效果。

先看下效果图:

 

仔细观察上图,我们可以发现,背景图以用户头像为模板,对其进行了高斯模糊,并把它作为整个页面的背景色。

关于AndroID如何快速实现高斯模糊(毛玻璃效果),网上一堆相关介绍,可参考下面文章一种快速毛玻璃虚化效果实现CAndroID。 下面直接给出模糊化工具类(已验证可行):

import androID.graphics.Bitmap;/*** 快速模糊化工具*/public class FastBlur {public static Bitmap doblur(Bitmap sentBitmap,int radius,boolean canReuseInBitmap) {Bitmap bitmap;if (canReuseInBitmap) {bitmap = sentBitmap;} else {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];bitmap.getPixels(pix,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;}}bitmap.setPixels(pix,h);return (bitmap);}}

那么,我们使用这个工具类,就可以高仿微信聊天页面了么? 答案是NO。

我们先看下直接使用该工具类能实现的效果:

 

我们可以看出来,通过该工具类,能实现图片的毛玻璃效果,可是并不理想,因为微信的背景颜色偏暗,而我们模糊化得到的图片颜色偏淡。 效果有些不尽如人意。 了解ios的人,或许知道,ios实现高斯模糊有直接的API: UIBlurEffectStyleExtralight、UIBlurEffectStylelight 、UIBlurEffectStyleDark,而UIBlurEffectStyleDark就可以直接实现比较暗的毛玻璃效果。 那放在androID这边,该如何办呢?

我这里采用的是“曲线求国”的策略,要想背景色偏暗,我们使用FrameLayout布局,在其中添加一个比较暗的一层VIEw,就可以实现啦。

<?xml version="1.0" enCoding="utf-8"?><FrameLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"androID:layout_wIDth="match_parent"androID:layout_height="match_parent"androID:fitsSystemwindows="true"androID:orIEntation="vertical"><ImageVIEwandroID:ID="@+ID/imgBg"androID:layout_wIDth="match_parent"androID:layout_height="match_parent"androID:adjustVIEwBounds="true"androID:maxHeight="1500dp"androID:maxWIDth="1000dp"androID:scaleType="centerCrop" /><ImageVIEwandroID:layout_wIDth="match_parent"androID:layout_height="match_parent"androID:background="#90000000" /><relativeLayoutandroID:ID="@+ID/rootVIEw"androID:layout_wIDth="match_parent"androID:layout_height="match_parent"androID:fitsSystemwindows="true"androID:orIEntation="vertical"><ImageVIEwandroID:ID="@+ID/imgUserhead"androID:layout_wIDth="100dp"androID:layout_height="100dp"androID:layout_centerHorizontal="true"androID:layout_margintop="80dp"androID:scaleType="fitXY"androID:src="@mipmap/ic_launcher" /><TextVIEwandroID:ID="@+ID/textUsername"androID:layout_wIDth="wrap_content"androID:layout_height="wrap_content"androID:layout_below="@ID/imgUserhead"androID:layout_centerHorizontal="true"androID:layout_margintop="30dp"androID:gravity="center_horizontal"androID:text="静音"androID:textcolor="#ffffff"androID:textSize="24dp" /></relativeLayout></FrameLayout>

上面代码中,可以看到,我们添加了这么一个ImageVIEw:

<ImageVIEwandroID:layout_wIDth="match_parent"androID:layout_height="match_parent"androID:background="#90000000" />

最重实现的效果图如下:

源码地址:https://github.com/zuiwuyuan/FastBlur_VoiceChat

以上所述是小编给大家介绍的AndroID 高仿微信语音聊天页面高斯模糊效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对编程小技巧网站的支持!

您可能感兴趣的文章:Android毛玻璃背景效果简单实现代码Android中实现iOS中的毛玻璃效果Android利用RenderScript实现毛玻璃模糊效果示例Android 实现图片模糊、高斯模糊、毛玻璃效果的三种方法Android学习教程之图片毛玻璃效果(4)Android开发之毛玻璃效果实例代码Android模糊处理简单实现毛玻璃效果Android模糊处理实现图片毛玻璃效果Android中实现毛玻璃效果的3种方法Android实现图片毛玻璃背景效果 总结

以上是内存溢出为你收集整理的Android 高仿微信语音聊天页面高斯模糊(毛玻璃效果)全部内容,希望文章能够帮你解决Android 高仿微信语音聊天页面高斯模糊(毛玻璃效果)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1142741.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-31
下一篇 2022-05-31

发表评论

登录后才能评论

评论列表(0条)

保存