CALayer基础

前端之家收集整理的这篇文章主要介绍了CALayer基础前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

上一篇文章中初步介绍了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

    @H_301_36@
  • kCAGravityTop

    @H_301_36@
  • kCAGravityBottom

    @H_301_36@
  • kCAGravityLeft

    @H_301_36@
  • kCAGravityRight

    @H_301_36@
  • kCAGravityTopLeft

    @H_301_36@
  • kCAGravityTopRight

    @H_301_36@
  • kCAGravityBottomLeft

    @H_301_36@
  • kCAGravityBottomRight

    @H_301_36@
  • kCAGravityResize

    @H_301_36@
  • kCAGravityResizeAspect

    @H_301_36@
  • kCAGravityResizeAspectFill

    @H_301_36@
//设置居中
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的时候图层会被截取,然后圆角设置就导致失败。

猜你在找的Swift相关文章