UIVisualEffectView为视图添加特殊效果

在iOS 8后,苹果开放了不少创建特效的接口,其中就包括创建毛玻璃(blur)的接口。

通常要想创建一个特殊效果(如blur效果),可以创建一个UIVisualEffectView视图对象,这个对象提供了一种简单的方式来实现复杂的视觉效果。这个可以把这个对象看作是效果的一个容器,实际的效果会影响到该视图对象底下的内容,或者是添加到该视图对象的contentView中的内容。

我们举个例子来看看如果使用UIVisualEffectView:


1

2

3

4

5

6

7

let bgView: UIImageView = UIImageView(image: UIImage(named: "visual"))

bgView.frame = self.view.bounds

self.view.addSubview(bgView)

let blurEffect: UIBlurEffect = UIBlurEffect(style: .Light)

let blurView: UIVisualEffectView = UIVisualEffectView(effect: blurEffect)

blurView.frame = CGRectMake(50.0, 50.0, self.view.frame.width - 100.0, 200.0)

self.view.addSubview(blurView)

这段代码是在当前视图控制器上添加了一个UIImageView作为背景图。然后在视图的一小部分中使用了blur效果。

我们可以看到UIVisualEffectView还是非常简单的。需要注意是的,不应该直接添加子视图到UIVisualEffectView视图中,而是应该添加到UIVisualEffectView对象的contentView中。

另外,尽量避免将UIVisualEffectView对象的alpha值设置为小于1.0的值,因为创建半透明的视图会导致系统在离屏渲染时去对UIVisualEffectView对象及所有的相关的子视图做混合操作。这不但消耗CPU/GPU,也可能会导致许多效果显示不正确或者根本不显示。

我们在上面看到,初始化一个UIVisualEffectView对象的方法是UIVisualEffectView(effect: blurEffect),其定义如下:


1

init(effect effect: UIVisualEffect)

这个方法的参数是一个UIVisualEffect对象。我们查看官方文档,可以看到在UIKit中,定义了几个专门用来创建视觉特效的,它们分别是UIVisualEffect、UIBlurEffect和UIVibrancyEffect。它们的继承层次如下所示:


1

2

3

4

NSObject

| -- UIVisualEffect

    | -- UIBlurEffect

    | -- UIVibrancyEffect

UIVisualEffect是一个继承自NSObject的创建视觉效果的基类,然而这个类除了继承自NSObject的属性和方法外,没有提供任何新的属性和方法。其主要目的是用于初始化UIVisualEffectView,在这个初始化方法中可以传入UIBlurEffect或者UIVibrancyEffect对象。

一个UIBlurEffect对象用于将blur(毛玻璃)效果应用于UIVisualEffectView视图下面的内容。如上面的示例所示。不过,这个对象的效果并不影响UIVisualEffectView对象的contentView中的内容。

UIBlurEffect主要定义了三种效果,这些效果由枚举UIBlurEffectStyle来确定,该枚举的定义如下:


1

2

3

4

5

enum UIBlurEffectStyle : Int {

    case ExtraLight

    case Light

    case Dark

}

其主要是根据色调(hue)来确定特效视图与底部视图的混合。

与UIBlurEffect不同的是,UIVibrancyEffect主要用于放大和调整UIVisualEffectView视图下面的内容的颜色,同时让UIVisualEffectView的contentView中的内容看起来更加生动。通常UIVibrancyEffect对象是与UIBlurEffect一起使用,主要用于处理在UIBlurEffect特效上的一些显示效果。接上面的代码,我们看看在blur的视图上添加一些新的特效,如下代码所示:


1

2

3

4

5

6

7

8

9

10

let vibrancyView: UIVisualEffectView = UIVisualEffectView(effect: UIVibrancyEffect(forBlurEffect: blurEffect))

vibrancyView.setTranslatesAutoresizingMaskIntoConstraints(false)

blurView.contentView.addSubview(vibrancyView)

var label: UILabel = UILabel()

label.setTranslatesAutoresizingMaskIntoConstraints(false)

label.text = "Vibrancy Effect"

label.font = UIFont(name: "HelveticaNeue-Bold", size: 30)

label.textAlignment = .Center

label.textColor = UIColor.whiteColor()

vibrancyView.contentView.addSubview(label)

vibrancy特效是取决于颜色值的。所有添加到contentView的子视图都必须实现tintColorDidChange方法并更新自己。需要注意的是,我们使用UIVibrancyEffect(forBlurEffect:)方法创建UIVibrancyEffect时,参数blurEffect必须是我们想加效果的那个blurEffect,否则可能不是我们想要的效果。

另外,UIVibrancyEffect还提供了一个类方法notificationCenterVibrancyEffect,其声明如下:


1

class func notificationCenterVibrancyEffect() -> UIVibrancyEffect!

这个方法创建一个用于通知中心的Today扩展的vibrancy特效。

原文链接:使用UIVisualEffectView为视图添加特殊效果

参考

  1. UIVisualEffectView Class Reference
  2. UIVisualEffect Class Reference
  3. UIBlurEffect Class Reference
  4. UIVibrancyEffect Class Reference
  5. UIVisualEffect – Swift Tutorial
  6. iOS 8: UIVisualEffect
时间: 2024-10-31 11:40:38

UIVisualEffectView为视图添加特殊效果的相关文章

SM30维护视图添加按钮

遇到某需求,要求维护sm30的视图时,能加上排序按钮. [转自http://blog.csdn.net/tsj19881202/article/details/7517232] 1. se11       点击修改,进入对应的表,然后点击“表格维护生成器” 2.进入后,点击 环境-修改-用户界面 3 点控制信息,创建控制信息. 4. 此时对应的程序应当为你的表名.5. se80 去打开程序,发现跟正常程序一样有“gui状态”,和“gui标题” 6.点开gui状态会发现有很多状态,这时候应该用哪一

HackSix 为ViewGroup的子视图添加悦目的动画效果

1.默认情况下他,添加到viewGrop的子视图是直接显示出来的.有一个比较简单的方法可以为这个过程增加动画效果. 2.知识点: 给子视图添加动画效果就用:LayoutAnimationController类,用LayoutAnimationController要强调一点的是不可以给每个子视图指定 不同的动画效果,但可以决定每个子视图显示动画效果的时间. 3.例子: 下面将结合托名都渐变动画(alpha animation)和位移动画(translate animation)演示给ListVie

ORACLE视图添加备注

ORACLE视图添加备注 版权声明:本文为博主原创文章,未经博主允许不得转载. create or replace view oes_material_series_ref as select t.productgroup, o.idnrk materialcode, t.seriescode   from oes_park_priority t  inner join oms_hm_mtl_general_view v     on t.materialcode = v.material_co

Android自定义视图三:给自定义视图添加“流畅”的动画

在第二部分我们实现了一个简单的折线图.这里假设你已经读了前篇.下面我们将继续为这个折线图添砖加瓦. 我在想给这个图的上方添加三个按钮,这样用户可以点选不同的按钮来查看不同类别的数据.比如,用户可以查看走路的.跑步的和骑车的.用户点不同的按钮,我们就跟还不同的运动数据显示在图形里. 我们实现了按钮点击后,设置不同的坐标点数据,然后运行APP.你会发现,虽然方法setChartData()已经被调用了,但是图形一点变化都没有.为什么呢?因为我们没有通知折线图"重绘".这可以通过调用inva

iOS--为视图添加阴影

iOS–为视图添加阴影 情况一:视图添加圆角,在添加阴影 //阴影视图 self.viewShadow = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 100, 100)]; self.viewShadow.backgroundColor = [UIColor redColor]; self.viewShadow.layer.shadowOpacity = 1; self.viewShadow.layer.cornerRadius = 5; sel

ios开发之手势动作状态细分state,同一视图添加两个手势

1.比如拖拽一个视图,形成类似scrollView的翻页形式 在拖拽的方法里判断拖拽的状态state属性,根据状态不同执行自己需要的效果. 2.同一视图添加两个手势,需要使用手势的代理方法.允许此操作.(可看手势演讲稿) 版权声明:本文为博主原创文章,未经博主允许不得转载.

sql server 创建视图添加表时出现从其他数据库导入的表未显示出来

创建视图添加表时出现从其他数据库导入的表未显示出来,通过数据库刷新,也不能解决.关闭SQL server management studio 后,再次进入,在创建视图的时候添加表的列表就出现了新导入的表. 原文地址:https://www.cnblogs.com/benpao1314/p/9472641.html

[Xcode10 实际操作]二、视图与手势-(4)给图像视图添加边框效果

本文将演示给图片添加颜色相框 1 import UIKit 2 3 class ViewController: UIViewController { 4 5 override func viewDidLoad() { 6 super.viewDidLoad() 7 // Do any additional setup after loading the view, typically from a nib. 8 //UIImage是一个用来加载和绘制图像的类 9 let image = UIIm

[Swift通天遁地]六、智能布局-(5)给视图添加Align(对齐)和Fill(填充的约束以及Label的约束

本文将演示如何给视图添加Align(对齐)和Fill(填充的约束以及Label的约束. 锚点默认位于视图中心点的位置. 首先确保在项目中已经安装了所需的第三方库. 点击[Podfile],查看安装配置文件. 1 platform :ios, ‘12.0’ 2 use_frameworks! 3 4 target 'DemoApp' do 5 source 'https://github.com/CocoaPods/Specs.git' 6 pod 'Neon' 7 end 根据配置文件中的相关配