背景毛玻璃实现效果:高斯模糊

毛玻璃效果:高斯模糊实现

这里是把新生成的页面以上一个页面为高斯模糊的底。

首先这里需要处理的一个问题是,上一个界面截屏。

1、获取上一界面的截图 :

  1. View view = activity.getWindow().getDecorView();
  2. view.setDrawingCacheEnabled(true);
  3. view.buildDrawingCache();
  4. Bitmap b1 = view.getDrawingCache();

DecorView是最顶端的View,在当前Activity中只有当运行到了onWindowFocusChanged的时候才能获取到View。

  1. public void onWindowFocusChanged(boolean hasFocus) {
  2. super.onWindowFocusChanged(hasFocus);
  3. View view = getWindow().getDecorView();
  4. view.setDrawingCacheEnabled(true);
  5. view.buildDrawingCache(true);
  6. blur(bmp1,bgLayout);
  7. }

在第二个Activity中使用Activity管理类获取上一个Activity的实例。需要做的去掉顶部的view。

  1. /**
  2. * 将一个Activity截图
  3. *
  4. * @param activity
  5. * @return
  6. */
  7. private Bitmap takeScreenShot(Activity activity) {
  8. View view = activity.getWindow().getDecorView();
  9. view.setDrawingCacheEnabled(true);
  10. view.buildDrawingCache();
  11. Bitmap b1 = view.getDrawingCache();
  12. // 获取状态栏高度
  13. Rect frame = new Rect();
  14. activity.getWindow().getDecorView().getWindowVisibleDisplayFrame(frame);
  15. int statusBarHeight = frame.top;
  16. // 获取屏幕长和高
  17. DisplayMetrics dm = new DisplayMetrics();
  18. activity.getWindowManager().getDefaultDisplay().getMetrics(dm);
  19. int width = dm.widthPixels;
  20. int height = dm.heightPixels;
  21. // 去掉标题栏
  22. Bitmap b = Bitmap.createBitmap(b1, 0, statusBarHeight, width, height
  23. - statusBarHeight);
  24. view.destroyDrawingCache();
  25. return b;
  26. }

2、做高斯模糊。

一般用的3种方法,第一种使用RenderScript;第二种使用开源的FastBlur;第三种使用的是优化了的FastBlur,即对FastBlur的

bitmap先放大尺寸再缩小,使其损失部分像素点,从而提高效率,避免OOM。所以推荐第三种。

  1. private void blur(Bitmap bkg, ViewGroup view) {
  2. long startMs = System.currentTimeMillis();
  3. float scaleFactor = 4;// 图片缩放比例;
  4. float radius = 20;// 模糊程度
  5. int width = (int) view.getMeasuredWidth();
  6. int height = (int) view.getMeasuredHeight();
  7. Bitmap overlay = Bitmap.createBitmap((int) (width / scaleFactor),
  8. (int) (height / scaleFactor), Bitmap.Config.ARGB_8888);
  9. Canvas canvas = new Canvas(overlay);
  10. canvas.translate(-view.getLeft() / scaleFactor, -view.getTop()
  11. / scaleFactor);
  12. canvas.scale(1 / scaleFactor, 1 / scaleFactor);
  13. Paint paint = new Paint();
  14. paint.setFlags(Paint.FILTER_BITMAP_FLAG);
  15. canvas.drawBitmap(bkg, 0, 0, paint);
  16. overlay = FastBlur.doBlur(overlay, (int) radius, true);
  17. view.setBackground(new BitmapDrawable(getResources(), overlay));
  18. /**
  19. * 打印高斯模糊处理时间,如果时间大约16ms,用户就能感到到卡顿,时间越长卡顿越明显,如果对模糊完图片要求不高,
  20. * 可是将scaleFactor设置大一些。
  21. */
  22. Log.i("jerome", "blur time:" + (System.currentTimeMillis() - startMs));
  23. }

blur的参数可以改成View或者ViewGroup,看情况,这个View是需要设置背景的控件。

还有一点。本方法放的位置:

onWindowFocusChaged方法里面;

或者是该View的回调事件使用;

或者onResume方法最后开线程300毫秒左右后获取宽和高 因为onResume执行完后300毫秒后 界面就显示出来了如onClick;

因为View.getgetMeasuredHeight()来获得某个view的宽度或高度,但是在onCreate()、onStrart()、onResume()

方法中会返回0,这是应为当前activity所代表的界面还没显示出来没有添加到WindowPhone的DecorView上或要获

取的view没有被添加到DecorView上或者该View的visibility属性为gone 或者该view的width或height真的为0所以

只有上述条件都不成立时才能得到非0的width和height。

Demo:MaoGlassDemo

其他相关资料:http://blog.csdn.net/huli870715/article/details/39378349

                        http://gqdy365.iteye.com/blog/2193913

http://blog.csdn.net/nailsoul/article/details/25909313

来自为知笔记(Wiz)

时间: 2024-10-16 14:07:09

背景毛玻璃实现效果:高斯模糊的相关文章

html5 canvas首屏自适应背景动画循环效果代码

模板描述:html5 canvas首屏自适应背景动画循环效果代码 由于动态图太大,怕以后服务器受不了,所以现在都改为静态图了,大家点击演示地址一样的,希望大家喜欢,你们的支持就是小海的动力!! 欢迎大家积极评论,给出宝贵意见 下 载 演示地址 本文地址:html5 canvas首屏自适应背景动画循环效果代码

10个Web前端值得收藏的背景全屏效果展示(附源码)(上)

作为一个前沿的 Web 开发者,对于 HTML5 和 现在流行的3D技术或多或少都有掌握.特别是在移动端大显身手.这篇文章挑选了10个绚丽的背景全景展示效果,希望对你有所帮助. 1.  JS图片背景全屏代码实现物理效果 玩法介绍:可以随意拖动鼠标.按住鼠标左键选中旋转物体.或者按住鼠标滑轮放大或者缩小,有不同的效果,赶紧来体验一下. 源码下载  /  在线演示 2.  CSS3学习 - 网站背景拉伸平铺jQuery插件 这个插件集成了一些非常好的 JavaScript 库,提供一个方便使用的文本

HTML5 Placeholder实现input背景文字提示效果

这篇文章我们来看看什么是input输入框背景文字提示效果,如下图所示: 这种效果现在网上非常的普遍流行,但大部分是使用JavaScript实现的.但HTML5给我们提供了新的纯HTML的实现方式,不需要任何的JavaScript,只需要在你的input文本框的标记上添加HTML5规范里新增的placeholder属性,然后在属性值里输入你需要的提示信息. 语法基本是这个样子:<input placeholder=”提示信息...”> HTML代码 <form> <input

CSS3感应鼠标的div背景闪烁动画效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>CSS3感应鼠标的div背景闪烁动画效果丨

页面弹框背景变暗的效果

<html> <head> <title>网页特效-窗口特效-弹出窗口后网页背景变暗的效果</title> <meta http-equiv="content-Type" content="text/html;charset=gb2312"> <!--把下面代码加到<head>与</head>之间--> <style type="text/css"

简单的jquery点击弹出背景变暗遮罩效果

工作中自己写了一个简单的jquery点击弹出背景变暗遮罩效果,非常好用......只把关键代码贴出来.并实现了点击空白处隐藏弹出层效果. js代码如下: <script type="text/javascript">  $(document).ready(function(){   $(".tkyy").click(function(event){      event.stopPropagation(); //停止事件冒泡    $(".ma

CSS实现背景透明/半透明效果的方法

全透明代码:{background:transparent} 半透明代码:{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto !important;width:100%} 其他的还有不少文章,有个不错,如何用CSS实现背景半透明效果? 内容详细如下:http://llf535.cn 龙行天下 精彩内容等着你 引用 如何用CSS实现背景半透明效果?做过活动页面的同学可能会遇到要做背景半透明的效果,我们一般的做法是用两个层,一个用于放文字,另一

IOS8模糊毛玻璃的效果UIVisualEffectView

UIVisualEffectView实现两种模糊效果:UIBlurEffect 和 UIVibrancyEffect 两者都是继承自UIView,前者放在任意的View里边都能对下册的视图渲染出模糊效果,后者是在前者的基础上对毛玻璃效果上层的视图做出高亮突出处理 代码如下: @IBOutlet weak var imageView: UIImageView! override func viewDidLoad() { super.viewDidLoad() var blurEffect = UI

利用css3制作毛玻璃的效果

忙里偷闲,最近又在看许多比较酷炫的效果.现在基于jquery的插件比较多,但是很多插件的兼容性不是太好,所以原生的才是王道.在日常当中,毛玻璃已经不常见了,那是一个很久远年代的东西了.诺,下面就是毛玻璃: 哈哈,不闲扯了,接下来不如正题吧,先看一下终极效果: 嗯,好了,,开始我们的步骤吧: 第一步:进行页面的基本搭建: 我在body上设置了一张大大的背景图,然后中间部分是一个div,html代码如下: <body> <div > iPhone 7 dramatically impr