最近木事，找出来玩了玩facebook的paper。到处都是那个"slide to unlock your phone"的效果啊。忽闪忽闪的小有点炫酷的感觉。于是准备研究一下。木有想到的是居然可以用CAGradientLayer和一个小小的动画就可以实现这个效果。“滑动解锁”的效果：
当然啦，首先你需要显示出这个“滑动解锁”的文本。这里咱们就用一个简单的UILabel来解决这个问题。
var textExampleLabel: UILabel!override func viewDidLoad() {super.viewDidLoad()textExampleLabel = UILabel(frame: CGRectMake(10, 100, UIScreen.mainScreen().bounds.size.width – 20, 30))textExampleLabel.text = self.view.addSubview(textExampleLabel)}
label作为成员变量（属性），在viewDidLoad方法中初始化并赋给“滑动解锁”的文本。
之后就用Gradient Layer来mask这段文本。来看看怎么准备这mask。要使用CALayer这个东东，千万不能少得就是前提条件需要引入QuartzCore。
import QuartzCore
之后为了迎接随后到来的gradient mask，需要重构一部分代码。让整个背景的颜色都为黑色，让label的文字为白色。这样看起来这个解锁的动画效果在强烈的黑白对比下更加明显。重构之后的代码：
self.view.backgroundColor = UIColor.blackColor()textExampleLabel = UILabel(frame: CGRectMake(10, 100, UIScreen.mainScreen().bounds.size.width – 20, 30))textExampleLabel.text = textExampleLabel.backgroundColor = UIColor.blackColor() // background color -> blacktextExampleLabel.textColor = UIColor.whiteColor()// foreground color -> whiteself.view.addSubview(textExampleLabel)
这些都是在viewDidLoad方法中的。
下面开始添加mask：
var gradientMask = CAGradientLayer()let colors: Array<AnyObject> = [UIColor.blackColor().CGColor, UIColor.whiteColor().CGColor, UIColor.blackColor().CGColor]gradientMask.colors = colorstextExampleLabel.layer.mask = gradientMask
运行出来之后，你会吓一跳。因为，全部都是黑得了。。。
这是因为，mask属性需要用到的是颜色的透明部分。也就是说给定的变化的颜色需要出现一部分透明或者半透明的颜色，这样的gradient layer作为另外一个layer的mask才能发挥作用。另外需要千万注意的一个问题是，上面的gradientMask还需要有一个frame。一般这个值是mask属性所在view的bounds。不要错用了frame，那样gradientMask就mask到错误的地方了。那么补全代码之后，如下：
var testGradient = CAGradientLayer()testGradient.frame = self.textExampleLabel.boundstestGradient.colors = [UIColor(white: 1.0, alpha: 0.3).CGColor, UIColor.yellowColor().CGColor, UIColor(white: 1.0, alpha: 0.3).CGColor]testGradient.startPoint = CGPointMake(0, 0.5)testGradient.endPoint = CGPointMake(1, 0.5)testGradient.locations = [0, 0.15, 0.3]
start point和end point这两个点分别是在layer的坐标体系中的表示。不是一般的定位frame中使用的x和y。比如，当（0.5，0.5）时，表示的是这个layer的中心，center point。（0，0.5）表示的是layer的伤沿的中点，而对应的（0，0.5）表示的下沿的中点。这里的start point和end point分别是左侧边线和右侧边线的中点。最后出现的渐变色的分界线和这点得连线垂直。这也是一个很重要的规律。gradient layer的locations是用来指定各个颜色的终止位置的。这里分别是0，0.15和0.3。这里可以把这些点理解为顺着颜色渐变线，也就是start point和end point的连线，的百分比的分布。不过，最后的一点效果是没有的。所以，最后的一种颜色一直延续到gradient layer的终点。
这里可以清楚的看到颜色的变化是从UIColor(white: 1.0, alpha: 0.3).CGColor一直到白色然后剩下的都是UIColor(white: 1.0, alpha: 0.3).CGColor。
到这里，就应该让我们的这个效果动起来了。不动的怎么能试动画呢？！
先补上刚刚漏掉的一句：
self.textExampleLabel.layer.mask = testGradient
添加动画的方式就比较简单了。用得就是远古的core animation：CABasicAnimation。这个animation是作用在gradient layer上得locations属性的。所以这个animation的初始化应该是这样的：
)
然后，这个animation就是从一个locations到另外的一个locations。就像我们看到的iphone的解锁画面一样，高亮一部分的文字，从头到尾，一次又一次的重复。一直到屏幕变暗为止。
)testAnimation.fromValue = [0, 0.15, 0.3]testAnimation.toValue = [1 – 0.3, 1 – 0.15, 1.0];testAnimation.repeatCount = 10000testAnimation.duration = 0.3testAnimation.delegate = self
我们这里，设定的颜色渐变是从0到0.15，然后到0.3。这是开始，那么最后的应该是什么样呢，就是长度为0.3的长度上又三个颜色，所以是从1.0 – 0.3，然后到1.0 – 0.15最后到1.0。中间所缺少的由动画自动补上。
好的，让动画起作用：
testGradient.addAnimation(testAnimation, forKey: )
只需要给layer添加刚刚初始化并配置好的动画之后。layer的动画就会开始运作。至于forKey的值可以很随意，什么都不给也可以。运行代码你就会看到这个动画的效果了。
始终调整好自己观风景的心态，
