iOS模糊效果(毛玻璃效果)的实现
前一段时间项目中用到毛玻璃效果,那时对UIBlurEffect类和 UIVisualEffectView这两个类做了一部分了解。但当时并没有去特别的深入研究,直到项目做完后,才静下心来好好研究了一番。记录一下。
iOS8之后,Apple新添加UIBlurEffect类、UIVibrancyEffect类 和 UIVisualEffectView类这三种类,用途就是对背景色进行模糊化,也就是我们称的 "毛玻璃效果"。接下来就对具体的使用做一下分析吧。
其实细看下来,Apple对这种特效封装的很好,所以我们使用起来的并不需要什么步骤。不得不佩服Apple的强大啊。
1、关于UIBlurEffect类
我们首先看UIBlurEffect类,Apple文档中只给出了一个方法:
+ (UIBlurEffect *)effectWithStyle:(UIBlurEffectStyle)style;
我们实现也是这样:
/**
* 模糊效果的三种风格
*
* @param UIBlurEffectStyle UIBlurEffectStyleExtraLight,//额外亮度,(高亮风格)
UIBlurEffectStyleLight,//亮风格
UIBlurEffectStyleDark//暗风格
*
*/
//实现模糊效果
UIBlurEffect *blurEffrct =[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
2、关于UIVibrancyEffect类
文档中给出的也是一个方法:
+ (UIVibrancyEffect *)effectForBlurEffect:(UIBlurEffect *)blurEffect;
官方给出的解释是这样的
/* UIVibrancyEffect amplifies and adjusts the color of content layered behind the view, allowing content placed inside the contentView to become more vivid. It is intended to be placed over, or as a subview of, a UIVisualEffectView that has been configured with a UIBlurEffect. This effect only affects content added to the contentView. Because the vibrancy effect is color dependent, subviews added to the contentView need to be tintColorDidChange aware and must be prepared to update themselves accordingly. UIImageView will need its image to have a rendering mode of UIImageRenderingModeAlwaysTemplate to receive the proper effect.
*/
翻译如下:
UIVibrancyEffect的作用是放大和调整UIVisualEffectView内容视图的内容的颜色,让UIVisualEffectView的contentView中的内容看起来更加生动。它作为一个子视图被放置在UIVisualEffectView上面,去连接UIBlurEffect。这种效果只会影响添加到UIVisualEffectView的contentView上的内容。因为活力影响是受颜色依赖的.....
我们可以看出:通常UIVibrancyEffect对象是与UIBlurEffect一起使用,主要用于处理在UIBlurEffect特效上的一些显示效果。
下面看看实现代码:
//实现模糊效果
UIBlurEffect *blurEffrct =[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]; UIVibrancyEffect *vibrancyEffect = [UIVibrancyEffect effectForBlurEffect:blurEffrct]; UIVisualEffectView *visualEffectView = [[UIVisualEffectView alloc]initWithEffect:vibrancyEffect];
// visualEffectView.backgroundColor = [ UIColor grayColor ];
visualEffectView.contentView.frame = CGRectMake(10, 100, 300, 500);
[self.view addSubview:visualEffectView];
下面我们往 UIVisualEffectView 的contentView上添加个view看看效果
UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(, , , )]; label.text = @"曾经撒次考试了hhhhhhhhhhhhhhh";
label.textAlignment = NSTextAlignmentLeft;
label.font = [UIFont systemFontOfSize:];
label.tintColor = [UIColor yellowColor];
label.numberOfLines = ;
[visualEffectView.contentView addSubview:label];
上面代码中可以看到, 我改变Label中text的颜色是使用的:tintColor ,这也是特别要注意的地方,文档中也有专门提出,并给出了解释:Because the vibrancy effect is color dependent, subviews added to the contentView need to be tintColorDidChange aware and must be prepared to update themselves accordingly. 所以我们使用 label.textColor去改变颜色是完全不起作用的。
运行效果图如下:(只剪切出效果部分)
至于颜色不是设置的yellowColor,我想不需要多说了吧,这就是UIVibrancyEffect的功能。
3、UIVisualEffectView类
老规矩先看文档:也是寥寥的四种,其中值得一提的是:contentView。这里明确告诉我们:不要直接添加子视图去UIVisualEffectView,而是要添加到contentView上。
@property (nonatomic, strong, readonly) UIView *contentView; // Do not add subviews directly to UIVisualEffectView, use this view instead. @property (nonatomic, copy, nullable) UIVisualEffect *effect; - (instancetype)initWithEffect:(nullable UIVisualEffect *)effect NS_DESIGNATED_INITIALIZER; - (nullable instancetype)initWithCoder:(NSCoder *)aDecoder NS_DESIGNATED_INITIALIZER;
这里我就给出一个比较完整的代码(我们看一看UIBlurEffect类 和 UIVisualEffectView类 的效果):
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"6.jpg"]];
/**
* 模糊效果的三种风格
*
* @param UIBlurEffectStyle UIBlurEffectStyleExtraLight,//额外亮度,(高亮风格)
UIBlurEffectStyleLight,//亮风格
UIBlurEffectStyleDark//暗风格
*
*/
//实现模糊效果
UIBlurEffect *blurEffrct =[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]; //毛玻璃视图
UIVisualEffectView *visualEffectView = [[UIVisualEffectView alloc]initWithEffect:blurEffrct]; visualEffectView.frame = CGRectMake(, , , ); visualEffectView.alpha = 0.9; [self.view addSubview:visualEffectView];
看看效果图是不是你想要的:
关于iOS8之前的实现,可以去github上看看一些封装库。有很多不错的三方库不错,这里就不列出了。
iOS模糊效果(毛玻璃效果)的实现的更多相关文章
- iOS 实现毛玻璃效果
话说苹果在iOS7.0之后,很多系统界面都使用了毛玻璃效果,增加了界面的美观性,比如下图的通知中心界面; 但是其iOS7.0的SDK并没有提供给开发者实现毛玻璃效果的API,所以很多人都是通过一些别人 ...
- iOS制作毛玻璃效果
//添加一个图片 UIImageView *imageview = [[UIImageView alloc]init]; imageview.frame = CGRectMake(10, 100, 3 ...
- Swift 之模糊效果(毛玻璃效果,虚化效果)的实现
前言: 之前项目中有用到过Objective-C的的模糊效果,感觉很是不错,而且iOS8之后官方SDK也直接提供了可以实现毛玻璃效果的三个类:UIBlurEffect.UIVibrancyEffect ...
- iOS开发探索-高斯模糊&毛玻璃效果
iOS开发中有的时候需要将图片设置模糊,来实现特定的效果获取更好的用户体验, iOS7之后半透明模糊效果得到大范围使用的比较大,现在也可以看到很多应用局部用到了图片模糊效果,可以通过高斯模糊和毛玻璃效 ...
- iOS 毛玻璃效果的实现方法
iOS开发中有的时候需要将图片设置模糊,来实现特定的效果获取更好的用户体验, iOS7之后半透明模糊效果得到大范围使用的比较大,现在也可以看到很多应用局部用到了图片模糊效果,可以通过高斯模糊和毛玻璃效 ...
- iOS毛玻璃效果的实现方法
ios开发中常常用到的毛玻璃效果实现方法 iOS8以后使用系统里的UIBlurEffect可以实现,UIBlurEffect继承自UIVisualEffect UIBlurEffectStyle有三个 ...
- iOS开发小技巧--实现毛玻璃效果的方法
一.美工出图 二.第三方框架 -- DRNRealTimeBlur,框架继承自UIView.使用方法:创建UIView直接继承自框架的View,就有了毛玻璃效果 三.CoreImage -- 图片加高 ...
- iOS 实现简单的毛玻璃效果
最近在整理导航栏的渐隐渐现效果,整理过程中偶然学会了图片的毛玻璃效果实现,很简单,不多说了,先上图看看效果对比, 这是原图, 这是加了效果后的,创建图片的代码就不上了,下面看下添加效果的代码: // ...
- iOS - 毛玻璃效果封装
#import <UIKit/UIKit.h> #import <Accelerate/Accelerate.h> @interface UIImage (TY_ImageEd ...
随机推荐
- [UOJ30/Codeforces Round #278 E]Tourists
传送门 好毒瘤的一道题QAQ,搞了好几好几天. UOJ上卡在了53个点,CF上过了,懒得优化常数了 刚看时一眼Tarjan搞个强连通分量然后缩点树链剖分xjb搞搞就行了,然后写完了,然后WA了QAQ. ...
- 11月15日下午 ajax返回数据类型为XML数据的处理
ajax返回数据类型为XML数据的处理 /*XML:可扩展标记语言 HTML:超文本标记语言 标签:<标签名></标签名> 特点: 1.必须要有一个根 2.标签名自定义 3.对 ...
- 深入理解java异常处理机制
异常指不期而至的各种状况,如:文件找不到.网络连接失败.非法参数等.异常是一个事件,它发生在程序运行期间,干扰了正常的指令流程.Java通 过API中Throwable类的众多子类描述各种不同的 ...
- Sql Server FOR XML PATH
FOR XML PATH 有的人可能知道有的人可能不知道,其实它就是将查询结果集以XML形式展现,有了它我们可以简化我们的查询语句实现一些以前可能需要借助函数活存储过程来完成的工作.那么以一个实例为主 ...
- Unix/Linux进程间通信(二):匿名管道、有名管道 pipe()、mkfifo()
1. 管道概述及相关API应用 1.1 管道相关的关键概念 管道是Linux支持的最初Unix IPC形式之一,具有以下特点: 管道是半双工的,数据只能向一个方向流动:需要双方通信时,需要建立起两个管 ...
- PHP mysql与mysqli事务详解
官方对PHP连接到MySQL数据库服务器的三种主要的API简介如下: http://php.net/manual/zh/mysqli.overview.php PHP mysql与mysqli事务详解 ...
- 【重点】Shell入门教程:流程控制(3)条件判断式的真假值
之前曾提到,在Bash中什么是真什么是假,是以命令的结束状态是否为0来做判断.传回0,即为真:传回非0,即为假. 在Bash中,这种可以影响程序流程的式子,称为条件判断式.判断式的操作数分成“单元”及 ...
- shell--4.echo和printf
1. echo (1) echo ,显示普通字符串 echo "HelloWorld" 打印:HelloWorld (2) \ ,显示转义字符串 echo "\" ...
- BZOJ1565——[NOI2009]植物大战僵尸
1.题意:有一些点,点与点之间有保护关系,每个点都有一个权值,求能获得的最大值 2.分析:裸的最大权闭合图,用网络流进行求解,然后我们发现点与点之间的保护关系可能构成环,这样网络流是无法处理的,然后我 ...
- linux常用命令-帮助命令man,whatis,apropos,info,help
man 命令 man 配置文件,注意这里只需要写文件名称就可以了,不能写文件的绝对路径 man既可以查看命令的帮助信息也可以查看配置文件的帮助信息,如果内容太多,可以输入"/内容" ...