CAShapeLayer的绘制

第一,绘制一个动画柱状图

    //创建路径
    UIBezierPath *bezierPath = [UIBezierPath bezierPath];
    [bezierPath moveToPoint:CGPointMake(10, 350)];
    [bezierPath addLineToPoint:CGPointMake(10, 100)];
    
    //创建图层
    CAShapeLayer *shape = [[CAShapeLayer alloc] init];
    shape.fillColor = [UIColor greenColor].CGColor;
    shape.frame = CGRectMake(50, 50, 20, 350);
    shape.strokeColor = [UIColor redColor].CGColor;
    shape.borderColor = [UIColor orangeColor].CGColor;
    shape.strokeStart = 0.0;
    shape.strokeEnd = 1.0;
    shape.lineWidth = 20;
    shape.backgroundColor = [UIColor greenColor].CGColor;
    shape.path = bezierPath.CGPath;
    [self.view.layer addSublayer:shape];
    
    //创建动画
    CABasicAnimation *anim = [CABasicAnimation animation];
    anim.keyPath = @"strokeEnd";
    anim.duration = 2.0f;
    anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    anim.fromValue = [NSNumber numberWithFloat:0.0];
    anim.toValue = [NSNumber numberWithFloat:1.0f];
    anim.autoreverses = NO;
    [shape addAnimation:anim forKey:@"strokeEnd"];

第二,绘制一个圆形进度条

   UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 100, 100)];
    
    self.shapeLayer = [CAShapeLayer layer];
    self.shapeLayer.frame = CGRectMake(100, 200, 100, 100);
    self.shapeLayer.backgroundColor = [UIColor clearColor].CGColor;
    
    self.shapeLayer.path = path.CGPath;
    self.shapeLayer.fillColor = [UIColor clearColor].CGColor;
    self.shapeLayer.lineWidth = 5.f;
    self.shapeLayer.strokeStart = 0.f;
    self.shapeLayer.strokeEnd = 1.0f;
    self.shapeLayer.strokeColor = [UIColor blackColor].CGColor;
    [self.view.layer addSublayer:self.shapeLayer];
    
    CABasicAnimation *anim = [CABasicAnimation animation];
    anim.keyPath = @"strokeEnd";
    anim.duration = 2.0f;
    anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    anim.fromValue = [NSNumber numberWithFloat:0.0];
    anim.toValue = [NSNumber numberWithFloat:1.0f];
    anim.autoreverses = NO;
    [self.shapeLayer addAnimation:anim forKey:@"strokeEnd"];

第三,设置UIBezierPath的起点 

 UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:CGPointMake(70, 80)];

设置结束点和控制点

    [path addQuadCurveToPoint:CGPointMake(150, 150) controlPoint:CGPointMake(100, 150)];
    [path addQuadCurveToPoint:CGPointMake(200, 150) controlPoint:CGPointMake(50, 200)];

完成对曲线的绘制