CALayer基础

浏览: 161 发布日期: 2016-12-06 分类: swift

上一篇文章中初步介绍了Core Animation框架,从中我们能发现图层树是其中的最基础和核心的概念。那么本文将会介绍最基础的CALayer,通过其中的一些基本属性实现基础的视觉效果。

寄宿图

俗话说一图胜千言,图片能给用户带来文字更好的视觉效果和更清晰的信息表达。在日常编写代码的过程中对于图片的处理使用最多的就是UIImageView视图控件。其实CALayer中的寄宿图也能胜任这项任务,其中使用到的属性就是寄宿图contents。该属性定义如下:

@property(strong) id contents;

contents的属性类型是id,这意味着该属性可以被任意赋值。但是在现实编码的过程中该属性只会处理CGImage对象,其余的赋值操作得到的结果都只会得到空白图层显示。之所以会如此怪异是因为在macOS的Cocoa框架中contents是可以接受CGImage和NSImage,而iOS的Cocoa Touch框架中其实接受的是一个指向CGImage对象的结构化指针CGImageRef。加载图形的代码与效果:

layer = CALayer()
viewForLayer = UIView.init(frame: CGRect.init(x: 50, y: 50, width: self.view.bounds.width - 100, height: self.view.bounds.height/2))
layer.frame = viewForLayer.bounds
layer.contents = UIImage.init(named: "YiXiu")?.cgImage
viewForLayer.layer.addSublayer(layer)
self.view.addSubview(viewForLayer)

CALayer中添加图片的方式与UIImageView的操作一样的简单。不过上图的显示效果不是很理想有很明显,这个现象在UIImageView中也会经常遇到,因此这里当然也有类似的处理方法。与View中的contentMode对应CALayer有一个contentsGravity,后者是一个NSString类型的枚举而前者是一个UIKit类型的枚举。contentsGravity枚举的可选值:

  • kCAGravityCenter

  • kCAGravityTop

  • kCAGravityBottom

  • kCAGravityLeft

  • kCAGravityRight

  • kCAGravityTopLeft

  • kCAGravityTopRight

  • kCAGravityBottomLeft

  • kCAGravityBottomRight

  • kCAGravityResize

  • kCAGravityResizeAspect

  • kCAGravityResizeAspectFill

 //设置居中
layer.contentsGravity = kCAGravityResizeAspect

图层阴影

iOS系统中常见的一个特性就是阴影,阴影在设计中的目的就是强调图层的景深显示图层的优先级。实现阴影效果的属性为:shadowOpacityshadowColorshadowOffsetshadowRadiusshadowPath,分别对应阴影的透明度、阴影颜色、阴影偏移、阴影圆角、阴影形状。最常用的是前面四个,最后一个shadowPath是在开发人员提前知道阴影形状时用来提过对图层阴影计算效率的。

//任意图层的透明度取值范围为0~1的浮点
layer.shadowOpacity = 1
//阴影的偏移量
layer.shadowOffset = CGSize.init(width: 30, height: 30)
//阴影的圆角值
layer.shadowRadius = 10
//阴影的颜色
layer.shadowColor = UIColor.gray.cgColor

图层边框

CALayer存在一个外框,我们可以通过设置边框的宽度的颜色来实现自定义外观。具体的设置操作:

layer.borderWidth = 2
layer.borderColor = UIColor.blue.cgColor

其他属性

圆角矩形是iOS设计中最常使用的设计美学,CALayer中的圆角设置:

viewForLayer.layer.cornerRadius = 10.0

CALayer中的透明度设置:

layer.opacity = 0.5;

CALayer中的背景色设置:

layer.backgroundColor = UIColor.red.cgColor

CALayer中设置超出内容的显示:

layer.masksToBounds = true

注意:当masksToBounds设置为true的时候图层会被截取,然后圆角设置就导致失败。

返回顶部