Android UI效果实现——滑动模糊渐变效果实现

前言：

大家应该都看到过iOS7解锁屏幕的滑动模糊渐变效果，好了，现在可以把手纸收起来了，今天黄老师就给大家讲一下如何在Android平台上

实现类似的滑动模糊渐变效果，其实方式远比你想像的简单。

目标效果展示：

第一部分：几个前提

说到模糊效果，我们先要了解几个前提

1、原图，指需要被模糊的一张位图

2、模糊，通常是采用指将一个位图的每个像素RGB值都取周围像素的RGB值的平均值，这样就可以产生模糊效果，一般通过高斯函数来实现，

至于Java中的实现方式黄老师就不给大家细讲了，我也不是搞图形算法的，在这方面了解的不比大家多，百度一下能找到一堆高斯模糊转换的实现。

3、模糊半径，指每个像素点周围模糊的半径，半径越大，模糊程度约高，模糊效果越明显，同时，模糊计算耗费时间越长。

4、模糊处理非常费时，一半在100ms～5000ms内，就黄老师我本人找的网上的算法实测，一般android通过java实现的高斯模糊算法转换一张手机

屏幕分辨率为480x800的位图需要2s左右，所以如果要在滑动的过程中实时不断重新计算模糊效果会非常差，所以如果要实现iOS7那样的滑动动态模糊

渐变效果，用这样的方式是不可行的，实际上iOS也不是这么做的，因为iOS的硬件也没达到能实时计算的程度。

那么究竟应该如何去实现模糊渐变呢，其实非常简单，我们接着讲。

第二部分：动态模糊渐变的合理实现方式

其实，我的方式非常简单，首先你需要明确一个最大的模糊效果的模糊半径值，我们给它取个名字叫maxRadius，然后使用maxRadius和原图传入高斯模糊算法

中计算出最大模糊效果的位图maxBlurBitmap。

然后，在ui组件中，假设我的原图是用一个ImageView显示在界面上的，然后你所需要做的是，再创建一个ImageView置于原图ImageView之上，然后将图片源

设置为maxBlurBitmap，如下图：

接着，我们只需要简单的调整maxBlurBitmap的透明度，即可实现模糊渐变效果了，是否很简单呢？

第三部分，提供一个最简单的Java高斯模糊实现，我网上找来的，方便偷懒不愿自己找的同学

 /**
  * 位图处理类
  * @author HalfmanG2
  */
 public class BitmapUtil {

     /**
      * 创建一个虚化的位图
      * @param sentBitmap 原位图
      * @param radius 虚化半径
      * @return 虚化后的位图
      */
     public static Bitmap createBlurBitmap(Bitmap sentBitmap, int radius) {
         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];
         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++) {
                 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);
     }
 }

最后，别废话了，赶紧自己去实现一个看看效果吧！顺便提一下，有更快的模糊算法(最好使用C实现)实现记得联系我：

QQ：811868948

E-Mail：halfmanhuang@gmail.com