CoreAnimation之CAShapeLayer

CAShapeLayer是CALayer的子类，但是CAShapeLayer的绘制必须依附于CGPath，其类型为CGPathRef。
使用CAShapeLayer创建一个圆形，一个多边形：

//圆形
    CAShapeLayer *circleLayer = [CAShapeLayer layer];
    //创建circleLayer图层，相当于容器，并不实际显示
    circleLayer.frame = CGRectMake(60, 120, 120, 120);
    //设置填充色
    circleLayer.fillColor = [UIColor blueColor].CGColor;
    //路径的颜色
    circleLayer.strokeColor = [UIColor blackColor].CGColor;
    //路径的宽度
    circleLayer.lineWidth = 3;
    //添加图层
    [self.view.layer addSublayer:circleLayer];
    //创建一个环形路径，其坐标是相对circleLayer的
    UIBezierPath *circlePath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 120, 120) cornerRadius:60];
    circleLayer.path = circlePath.CGPath;
//多边形
    CAShapeLayer *starLayer = [CAShapeLayer layer];
    starLayer.frame = CGRectMake(250, 120, 120, 120);
    starLayer.fillColor = [UIColor blueColor].CGColor;
    starLayer.strokeColor = [UIColor blackColor].CGColor;
    starLayer.lineWidth = 3;
    [self.view.layer addSublayer:starLayer];
    UIBezierPath *starPath = [UIBezierPath bezierPath];
    [starPath moveToPoint:CGPointMake(60, 0)];
    [starPath addLineToPoint:CGPointMake(90, 60)];
    [starPath addLineToPoint:CGPointMake(120, 60)];
    [starPath addLineToPoint:CGPointMake(95, 70)];
    [starPath addLineToPoint:CGPointMake(115, 120)];
    [starPath addLineToPoint:CGPointMake(60, 90)];
    [starPath addLineToPoint:CGPointMake(5, 120)];
    [starPath addLineToPoint:CGPointMake(25, 70)];
    [starPath addLineToPoint:CGPointMake(0, 60)];
    [starPath addLineToPoint:CGPointMake(30, 60)];
    [starPath closePath];
    starLayer.path = starPath.CGPath;

CAShapeLayer.png

接下来使用CAShapeLayer配合NSTimer实现一个环形的进度条：

    UIBezierPath *progressPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(10, 10, 180, 180)];
    self.progressLayer = [CAShapeLayer layer];
    self.progressLayer.frame = CGRectMake(self.view.bounds.size.width/2-100, self.view.bounds.size.height/2+80, 200, 200);
    self.progressLayer.fillColor = [UIColor clearColor].CGColor;
    self.progressLayer.strokeColor = [UIColor orangeColor].CGColor;
    self.progressLayer.lineWidth = 5;
    self.progressLayer.path = progressPath.CGPath;
    //环形的开始位置是从右边开始的，这里为了达到效果，需要旋转90度
    [self.progressLayer setValue:@(M_PI_2) forKeyPath:@"transform.rotation.z"];
    [self.view.layer addSublayer:self.progressLayer];
   //strokeStart和strokeEnd就是画笔的起点和终点
   //0在最右边，0.25在下，0.5在左，0.75在上，1在最右和0重合
    self.progressLayer.strokeStart = 0;
    self.progressLayer.strokeEnd = 0;
   //使用NSTimer实现的动画效果
    _timer = [NSTimer scheduledTimerWithTimeInterval:1 target:self selector:@selector(progressSetting) userInfo:nil repeats:NO];

- (void)progressSetting {
    self.progressLayer.strokeStart = 0.15;
    self.progressLayer.strokeEnd = 0.85;
}

progressLayer.gif

CAShapeLayer在这里值得说的两个属性也就是strokeStart和strokeEnd，strokeStart和strokeEnd 都是0-1的取值范围。分别表示路径的开始和结尾位置。比如开始位置为0.5结束位置为1 那就只渲染出后半段的路径。

参考链接
http://blog.csdn.net/yixiangboy/article/details/50662704