IOS8视觉特效VisualEffects实现方法..docxVIP

IOS 8视觉特效Visual Effects实现方法从iOS 7开始，苹果改变了App的UI风格和动画效果，例如当导航栏出现在屏幕上的效果。尤其是苹果在iOS 7中，使用了全新的雾玻璃效果（模糊特效）。不仅仅是导航栏，通知中心和控制中心也采用了这个特殊的视觉效果。但是苹果并没有在SDK中放入这个特效，程序员不得不使用自己的方法在模拟这个效果，一直到iOS 8的出现。在iOS 8中，SDK中终于正式加入了这个特性，不但让程序员易于上手，而且性能表现也很优秀。苹果将之称为Visual Effects（视觉效果）。Visual Effects是一整套的视觉特效，包括了UIBlurEffect和UIVibrancyEffect。这两者都是UIVisualEffect的子类，前者允许在你App中动态地创建实时的雾玻璃效果，而后者则允许你在雾玻璃上“写字”。接下来，我们将介绍Visual Effects。Visual Effects 初步Visual Effects其实可以直接在IB中使用，在IB的Object Library 中，新增了两个Visual Effect View对象。这是我们使用Visual Effects的最简单方法。初始项目初始项目位于本章源代码文件夹下的VisualEffectsStarter。在初始项目中，我们已经为程序创建了基本的框架代码和必要的UI布局，在接下来的章节中，作者将在这个初始项目的基础上进行工作。打开初始项目，在项目导航窗口，有2个ViewController类是值得注意的：ViewController.swift程序一启动时显示的ViewController。在这个界面中我们仅仅显示了一张图片（UIImageView）和一个导航栏右按钮。PopupVC.swift当用户点击导航栏上的右按钮，从屏幕底部弹出这个ViewController。这个ViewController只占据了屏幕下端的160个像素高度。上面显示了2个图形按钮。运行程序，这个简单的程序模拟了一个弹出菜单的效果：图 19 - 1初始项目运行效果再次点击导航栏按钮，PopupVC收起。使用Visual Effect View实现模糊特效打开Main.storyboard。选择PopupVC Scene。我们将在这个View Controller中使用Visual Effects。在右边的Object Library面板，在有哪些信誉好的足球投注网站栏中输入“visual”，这将迅速定位到两个Visual Effect View控件。图 19 - 2 Object Library中的Visual Effect View拖一个Visual Effect View with Blur到PopupVC的View上。在Document Outline窗口中，调整Visual Effect View with Blur的位置，使它位于2个按钮之下：图 19 - 3 将Visual Effect View插入到最底层调整Visual Effect View的自动布局，使它占据整个View大小：图 19 - 4 设置Visual Effect View的约束在属性面板，设置Visual Effect View的Blur Style属性为Light。Blur Style可以有3个值：Extra Light、Light、Dark，分别有3种不同的模糊效果：很亮、亮、暗色。在IB中无法看到Visual Effect View的效果，我们需要运行程序。运行程序，下图为Blur Style分别设置为Light和Dark的效果：图 19 - 5 Light和Dark模糊效果如果你看不到丝毫模糊效果（添不添加Visual Effect View都一样），则你可能要将PopupVC的view设置为背景透明。使用Visual Effect View实现Vibrancy效果Vibrancy效果是一种专门应用在模糊效果上的特殊效果。它会在模糊效果的基础上留下一些特殊的空洞，使得这些地方上的内容看起来更加生动。你可以想像一下雾玻璃效果是什么。它就好像是冬天的时候，你在玻璃上哈气。原本透明的玻璃哈上气后，会结上一层水汽，看起来就像是“雾玻璃”一样。如果你伸手在这层水汽上写字，则会在雾气上留下明显的字迹，这就是Vibrancy效果。我们可以使用Visual Effect View来实现Vibrancy效果。Vibrancy效果使用Object Library中的“Visual Effect Views with Blur and Vibrancy”来实现。从名称上看，“Visual Effect Views with Blur and Vibrancy”包括了两个Visual Effect Vie