Core Animation －视觉效果<一>

最新推荐文章于 2017-03-24 08:45:56 发布

原创最新推荐文章于 2017-03-24 08:45:56 发布 · 859 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#阴影 #圆角

Core Animation 专栏收录该内容

41 篇文章

订阅专栏

本文深入探讨iOS开发中如何通过设置CALayer的属性来实现圆角矩形、边框、阴影等效果，包括具体代码实现和原理解析，帮助开发者更好地理解并应用这些UI设计元素。

1.圆角
在iOS中圆角矩形被运用得淋漓尽致，也成为苹果设计的标志性特点，而我们在开发中也常使用设置某个视图为圆角显示，设置方法为：

self.layerView1.layer.cornerRadius = 20.0f;

这个值默认为0，是一个直角，正常情况，不管怎么设置，他不会对子图层造成任何影响。相信很多人以前只知道这么来设置圆角，却不知道为什么，看到这里我想应该明白了，这其实是CALayer的一个属性，而非视图的属性，只是视图同样可以使用。我们设置圆角实际上是设置图层的圆角，而视图则是图层的直观展示。
2.图层边框
说到这个边框，在日常开发中还是比较常见的，borderWidth，它以点为单位定义了边框的宽度，默认为0，默认颜色为黑色，

self.layerView2.layer.borderWidth = 5.0f;
//四个参数分别为red，green，blue，alpha
self.layerView2.layer.borderColor = CGColorCreate(colorSpace,(CGFloat[]){ 0.32, 0.64, 0.96, 1.00 });;

3.阴影
shadowOpacity用来控制阴影的显示，它的值在0-1.0之间，默认为0，无阴影，它还有另外三个参数， shadowColor ，shadowOffset和shadowRadius，从字面不难猜出他们的作用，分别是设置阴影颜色，设置阴影的偏移量，设置阴影的模糊度，其中阴影默认颜色为黑色，默认偏移量为CGSize类型，默认为｛0，－3｝，默认模糊度为0，介于0-1.0之间，越大模糊度越高。
4.阴影剪裁
我们上面说到的阴影是就图层边框而言，而图层的阴影继承自图层的形状，所以阴影是根据寄宿图的轮廓而定的。当我们设置了maskToBounds属性为YES时，它在裁剪掉其上多余的视图之外还将阴影给裁剪掉了，但这并不符合我们的需要，为了解决这个问题，书中提到了一种方法，放置好我们的图层，将放在最下面用来裁剪的图层用一个新的图层包裹起来，也就是为它增加一个父视图，并设置这个父视图的阴影，这样，当原来的图层的阴影被剪裁了的时候，它的父图层和它一样大小，父图层的阴影效果就充当了原图层阴影的效果。

这里说道的东西都不难，但是并不好理解和记忆，最好是自己动手写写代码，增加印象。