ios开发中常常用到的毛玻璃效果实现方法

iOS8以后使用系统里的UIBlurEffect可以实现,UIBlurEffect继承自UIVisualEffect

UIBlurEffectStyle有三个值,UIBlurEffectStyleLight , UIBlurEffectStyleExtraLight , UIBlurEffectStyleDark,可以控制毛玻璃的效果.

    UIBlurEffect *effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleDark];
UIVisualEffectView *effectView = [[UIVisualEffectView alloc] initWithEffect:effect];
//必须给effcetView的frame赋值,因为UIVisualEffectView是一个加到UIIamgeView上的子视图.
effectView.frame = _imageView.bounds;
[self.imageView addSubview:effectView];

UIVibrancyEffect也继承自UIVisualEffect类,可以用来设置一些特殊的效果.代码如下

    UIBlurEffect *effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
UIVisualEffectView *effectView = [[UIVisualEffectView alloc] initWithEffect:effect];
effectView.frame = _imageView.bounds; UIVibrancyEffect *viBrancyeffect = [UIVibrancyEffect effectForBlurEffect:effect];
UIVisualEffectView *vibrancyEffectView = [[UIVisualEffectView alloc] initWithEffect:viBrancyeffect]; vibrancyEffectView.frame = CGRectMake(100, 0, 200, 200);
UILabel *lbl = [[UILabel alloc] init];
lbl.text = @"测试Label";
lbl.font = [UIFont systemFontOfSize:25];
lbl.frame = CGRectMake(0, 0, 200, 200); [vibrancyEffectView.contentView addSubview:lbl];
[effectView.contentView addSubview:vibrancyEffectView];
[self.imageView addSubview:effectView];

但是这种毛玻璃效果不能很好的控制模糊效果,可以alpha属性控制并不完美.
效果如下:

使用系统CoreImage中的滤镜产生毛玻璃效果

原理是给图片添加滤镜,这种方式相比上面更为可控,下面介绍一下系统滤镜中支持的毛玻璃效果

先简要介绍一下系统滤镜CIFilter的使用

CIfilter中有一个专门用于毛玻璃效果的Category : kCICategoryBlur
使用下面的代码可以打印出这个分类下的滤镜

NSArray *filters = [CIFilter filterNamesInCategory:kCICategoryBlur];

可以得到结果

**    CIBoxBlur,**
** CIDiscBlur,**
** CIGaussianBlur,**
** CIMaskedVariableBlur,**
** CIMedianFilter,**
** CIMotionBlur,**
** CINoiseReduction,**
** CIZoomBlur**

我们使用最常见的高斯模糊 (Gaussian Blur) 来进行举例

NSArray *inputKeys = filter.inputKeys;

可以得到这个滤镜支持两个输入属性,分别是inputImage,inputRadius
其中inputImage指你需要添加滤镜效果的图片,inputRadius指进行高斯模糊的程度
设置属性的方式有两种
一种是直接通过NSDictionary赋值

CIImage *testCIImage = [CIImage imageWithCGImage:[UIImage imageNamed:@"testImg.jpg"].CGImage];
NSDictionary *filterAttDict = @{@"inputImage" : testCIImage
,@"inputRadius" : [NSNumber numberWithDouble:5.0f]};
CIFilter *filter = [CIFilter filterWithName:@"CIGaussianBlur" withInputParameters:filterAttDict]; CIImage *outPutCIImage = [filter outputImage]; CIContext *ciContext = [CIContext contextWithOptions:nil];
CGImageRef cgImage = [ciContext createCGImage:outPutCIImage fromRect:outPutCIImage.extent];
UIImage *resImage = [UIImage imageWithCGImage:cgImage];

另一种是通过kvc方法赋值

    CIFilter *filter = [CIFilter filterWithName:@"CIGaussianBlur"];

    CIImage *testCIImage = [CIImage imageWithCGImage:[UIImage imageNamed:@"testImg.jpg"].CGImage];

    [filter setValue:testCIImage forKeyPath:kCIInputImageKey];
[filter setValue:@50 forKeyPath:kCIInputRadiusKey]; CIImage *outPutCIImage = [filter outputImage]; CIContext *ciContext = [CIContext contextWithOptions:nil];
CGImageRef cgImage = [ciContext createCGImage:outPutCIImage fromRect:outPutCIImage.extent];
UIImage *resImage = [UIImage imageWithCGImage:cgImage];

发现一个写的比较详细的博客,可以参考 http://www.jianshu.com/p/d115836ed3fa

iOS毛玻璃效果的实现方法的更多相关文章

  1. iOS 毛玻璃效果的实现方法

    iOS开发中有的时候需要将图片设置模糊,来实现特定的效果获取更好的用户体验, iOS7之后半透明模糊效果得到大范围使用的比较大,现在也可以看到很多应用局部用到了图片模糊效果,可以通过高斯模糊和毛玻璃效 ...

  2. CSS3中毛玻璃效果的使用方法

    今天在使用icloud的时候看到苹果icloud官网的毛玻璃效果非常赞,仔细研究了一下它的实现方式,是使用js配合background-image: -webkit-canvas的形式绘制出的毛玻璃背 ...

  3. iOS - 毛玻璃效果封装

    #import <UIKit/UIKit.h> #import <Accelerate/Accelerate.h> @interface UIImage (TY_ImageEd ...

  4. ios毛玻璃效果

    方法一:支持所有ios系统版本: - (void)setupBlurView { UIImageView *darkView = [[UIImageView alloc] init]; darkVie ...

  5. ios 毛玻璃效果

    推荐第三方库: https://github.com/nicklockwood/FXBlurView FXBlurView*Fx=[[FXBlurView alloc]initWithFrame:CG ...

  6. view添加毛玻璃效果两种方法

    第一种方法: UIBlurEffect *effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]; UIVisualEffectV ...

  7. 解决css3毛玻璃效果(blur)有白边问题

    做一个登录页,全屏背景图毛玻璃效果,实现方法如下: HTML: <body> <div class="login-wrap"> <div class= ...

  8. CSS 奇思妙想 | 全兼容的毛玻璃效果

    通过本文,你能了解到 最基本的使用 CSS backdrop-filter 实现磨砂玻璃(毛玻璃)的效果 在至今不兼容 backdrop-filter 的 firefox 浏览器,如何利用一些技巧性的 ...

  9. iOS开发小技巧--实现毛玻璃效果的方法

    一.美工出图 二.第三方框架 -- DRNRealTimeBlur,框架继承自UIView.使用方法:创建UIView直接继承自框架的View,就有了毛玻璃效果 三.CoreImage -- 图片加高 ...

随机推荐

  1. Python3入门(十三)——常用内置模块之摘要模块hashlib/hmac

    (1)hashlib hashlib提供了常见摘要算法:如MD5,SHA1等等 一个md5的加密示例如下: import hashlib m = hashlib.md5() m.update(&quo ...

  2. centos 安装最新版git

    对个人而言,gitlab有点浪费资源,占内存太大,一个博客服务器,配置比较低,用gitlab太浪费了.(公司使用gitlab,这个适合公司团队使用) 前提条件,放行git端口,防火墙添加放行规则,将3 ...

  3. mat文件读写

    一起来学演化计算-mat文件读写 觉得有用的话,欢迎一起讨论相互学习~Follow Me Matlab读取和保存mat文件数据 在matlab命令行中输入save 变量名a,将a变量保存在新生成的a. ...

  4. Spring Cloud与Docker微服务架构实战 PDF版 内含目录

    Spring Cloud与Docker微服务架构实战  目录 1 微服务架构概述 1 1.1 单体应用架构存在的问题1 1.2 如何解决单体应用架构存在的问题3 1.3 什么是微服务3 1.4 微服务 ...

  5. SAP RFC和BAPI

    RFC和BAPI都是SAP提供的接口技术.RFC全称Remote Function Call,就是允许远程调用的函数模块. BAPI则是基于RFC的新技术,全称Business Application ...

  6. Cas(07)——建立使用Cas进行单点登录的应用

    建立使用Cas进行单点登录的应用 目录 1.1加入cas-client-core-xxx.jar到classpath 1.2配置Filter 1.2.1AuthenticationFilter 1.2 ...

  7. xray写POC踩坑

    错误记录 静态文件目录不一定是static. 只考虑了linux的情况,如果是 windows 呢,能读取某些应用自己的源码吗. 实际环境参数不一定是id,thinkphp 不适合使用 poc 来写 ...

  8. iOS底层框架浅析

    1.简介 IOS是由苹果公司为iPhone.iPod touch和iPad等设备开发的操作系统. 2.知识点 iPhone OS(现在叫iOS)是iPhone, iPod touch 和 iPad 设 ...

  9. Exchanger实现线程间数据交换

    package com.duchong.concurrent; import java.util.ArrayList; import java.util.List; import java.util. ...

  10. 基于vue-cli、elementUI的Vue简单入门例子

    vue-cli.elementUI的安装教程请看: https://www.cnblogs.com/joe235/p/12013818.html 把HelloWorld.vue文件修改为: <t ...