ios使用CAShapeLayer，UIBezierPath，CABasicAnimation 画百分比圆圈

1. 普通的用法（先学习咋用）

代码如下

- (void)viewDidLoad {
    [super viewDidLoad];
    
    CAShapeLayer *shapeLayer = [CAShapeLayer layer];
    shapeLayer.frame = CGRectMake(50, 50, 150, 150);
    shapeLayer.strokeEnd = 1.0f;
    shapeLayer.strokeStart = 0.0f;
    shapeLayer.lineWidth     = 10;          //设置线宽
    shapeLayer.lineCap       = kCALineCapRound;    //设置线头形状
    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:shapeLayer.frame];
    shapeLayer.path = path.CGPath;
    shapeLayer.fillColor = [UIColor clearColor].CGColor;
    shapeLayer.strokeColor = [UIColor redColor].CGColor;
    shapeLayer.fillRule       = kCAFillRuleEvenOdd;  //重点， 填充规则
    
    CABasicAnimation *pathAnima = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    pathAnima.duration = 10.0f;				//动画时间
    pathAnima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];      //动画的运动曲线
    pathAnima.fromValue = [NSNumber numberWithFloat:0.0f];		//值 开始
    pathAnima.toValue = [NSNumber numberWithFloat:1.0f];			//值 结束
    pathAnima.fillMode = kCAFillModeBoth;									//填充方式，反正我是没试通。。。求大佬解释
    pathAnima.removedOnCompletion = NO;									//完成后是否删除动画
    [shapeLayer addAnimation:pathAnima forKey:@"strokeEndAnimation"];//不知道，求大佬解释
    [self.view.layer addSublayer:shapeLayer];
}

效果如下：

【那怎么做从12点开始方向开始的动画】

• CABasicAnimation 给CAShapeLayer的strokeStart和strokeEnd属性进行控制来进行动画
• 但是这个方法没法让圆的开始在12点的方向，因为。。。官方说
  

2. 更好的用法

CAShapeLayer的path定为从12点开始的圆就行了。

这个好像就是用来画线条的函数：
[UIBezierPath bezierPathWithArcCenter:self.view.center radius:(mybound.size.width - 0.7)/ 2 startAngle:0 endAngle:M_PI * 2 clockwise:YES];
顺时针情况：
radius: 半径
startAngle ：-180
endAngle：180
clockwise:YES 顺时针
逆时针情况：
startAngle ：180
endAngle：-180

- (void)viewDidLoad {
    [super viewDidLoad];
    CGRect mybound = CGRectMake(50, 200, 150, 150);
    [self startProgressAction:mybound];
}

//画两个圆形
-(void)startProgressAction:(CGRect)mybound
{
    static CGFloat hudu = 1;
    //底下的框（灰色）不会动的
    _trackPath = [UIBezierPath bezierPathWithArcCenter:self.view.center radius:(mybound.size.width - 0.7)/ 2 startAngle:0 endAngle:M_PI * 2 clockwise:YES];
    
    _trackLayer = [CAShapeLayer new];
    [self.view.layer addSublayer:_trackLayer];
    _trackLayer.fillColor = nil;
    _trackLayer.strokeColor=[UIColor grayColor].CGColor;
    _trackLayer.path = _trackPath.CGPath;
    _trackLayer.lineWidth=10;
    _trackLayer.frame = mybound;
    
    //会动的
    _progressPath = [UIBezierPath bezierPathWithArcCenter:self.view.center radius:(mybound.size.width - 0.7)/ 2 startAngle:- M_PI_2 endAngle:(M_PI * 2) - M_PI_2 clockwise:YES];
    
    _progressLayer = [CAShapeLayer new];
    [self.view.layer addSublayer:_progressLayer];
    _progressLayer.fillColor = nil;
    _progressLayer.strokeColor=[UIColor redColor].CGColor;
    _progressLayer.lineCap = kCALineCapRound;
    _progressLayer.path = _progressPath.CGPath;
    _progressLayer.lineWidth=10;
    _progressLayer.frame = mybound;
    _progressLayer.strokeEnd = 1;
    _progressLayer.strokeStart = 0;
    
    CABasicAnimation *pathAnima2 = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    pathAnima2.duration = 10.0f;
    pathAnima2.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    pathAnima2.fromValue = [NSNumber numberWithFloat:0.0f];
    pathAnima2.toValue = [NSNumber numberWithFloat:1.0f];
    pathAnima2.fillMode = kCAFillModeBoth;
    pathAnima2.removedOnCompletion = NO;
    [_progressLayer addAnimation:pathAnima2 forKey:@"strokeEndAnimation"];
}

效果就自己试，反正就是赋值粘贴的事～