iOS核心动画笔记3-视觉效果

视觉效果

1. 圆角

CALayer conrnerRadius属性控制图层角度的曲率. 浮点数, 默认是0, 这个曲率值只能影响背景颜色而不影响背景图片或是子图层.CALayer还有个maskToBounds属性,设置为YES时候,图层里面全部东西都会被截取.

2. 图层边框

CALayer另外两个很是有用的属性就是borderWidth,borderColor,这两个属性定义了图层边的绘制样式,这条线沿着图层的bounds绘制,同事也包含图层的角.

边框是绘制在图层边界里面的,并且在全部子内容以前,也在子图层以前.

3. 阴影

阴影相关的属性:

shadowRadius; //阴影虚化半径
shadowColor; //阴影颜色, 默认是黑色
shadowOffset; //阴影偏移
shadowOpacity; //阴影的不透明度
shadowPath; //阴影路径,CGPath类型

• shadowOpacity: 表示不透明度,1:彻底不透明; 0, 彻底透明.
• shadowOffset: 控制阴影的方向和距离,是一个CGSiz的值,宽度控制横向偏移,高度控制纵向偏移,默认值是{0, -3}, 相对y向上偏移3个点. 缘由是shadow最初是在mac OS上面世的, 而Mac OS上,y轴方向和iOS上y轴方向是颠倒的, 在Mac上shadowOffset默认值是向下偏移的,因此形成iOS上默认值向上偏移.
• shadowRadius: 一般, 越是须要让视图或者控件很是醒目独立于背景以外, 就应该给shadowRadius设置一个稍大的值, 阴影月模糊, 图层的深度看上去就会越明显.

4. 阴影裁剪

图层的边框继承自本图层的边框和cornerRadius,可是图层的阴影继承自内容的外形(包括子图层), 而不是根据边界和角半径来肯定. 为了计算出阴影的形状,CoreAnimation会将寄宿图(包括子视图)考虑在内,而后经过这些来完美搭配图层形状从而建立一个阴影.

当阴影和裁剪扯上关系, 就会出现很麻烦的限制, 要裁剪的话, 在图层边框以外全部绘制都会被裁减掉, 包括阴影, 可是又须要阴影, 怎么办呢? 解决就是, 阴影图层做为容器图层, 裁剪图层做为子图层, 这样能够完美解决.

5. shadowPath属性

从上上一节已经了解到, 阴影并不老是方的, 而是根据图层以及子图层的内容计算出来的. 可是有时候计算阴影也是给长消耗资源的, 尤为是图层中有不少子图层时候.

若是咱们事先知道阴影形状是什么样子的, 那么能够经过制定shadowPath来提升性能. 值是一个CGPathRef类型的. CGPath是 Core Graphics 对象, 能够制定任意的矢量图形. 咱们能够经过这个属性独立于图层以外制定阴影的外形.

复杂的形状, 咱们能够经过UIBezierPath来绘制.

6. 图层蒙版

CALayer有个mask属性, 这个属性自己是一个CALayer类型, 有和其它图层同样的绘制和布局属性. 它相似于一个子图层, mask图层中被绘制或者有内容的区域是透明的, 能够看到父图层上的内容, 就像是ps上的蒙版效果. mask图层定义了父图层的可见部分.

mask图层的color属性是不关紧要的, 重要的图层的轮廓, mask图层实心的部分就是父图层会被保留下来的部分.

示例代码:

//测试mask属性
    CALayer *bgLayer = [CALayer layer];
    bgLayer.backgroundColor = [UIColor redColor].CGColor;
    bgLayer.frame = CGRectMake(0, 0, 100, 50);
    [self.maskView.layer addSublayer:bgLayer];
    
    self.maskView.backgroundColor = [UIColor blueColor];
    CALayer *maskLayer = [CALayer layer];
    maskLayer.contentsGravity = kCAGravityCenter;
    maskLayer.contents = (__bridge id)image.CGImage;
    maskLayer.frame = self.layerView.bounds;
    self.maskView.layer.mask = maskLayer;
    /*
     看到这个属性, 猜想这个属性能够实现的功能:
        1. 文本, 一个文字, 一半一个颜色.
        2. maskView上放个shapeLayer, 有背景色, mask是一个被填充满的layer, 能够经过控制shapeLayer来控制被填充的程度, 这个能够实现不少功能, 好比 进度条, 好比按住开始录音那个动画效果, 等等等等.
     */

效果:

7. 拉伸过滤

这个还没看懂....

8. 组透明

这个文章最后一小节:

http://wiki.jikexueyuan.com/project/ios-core-animation/visual-effect.html