美文网首页
UIBezierPath与CAShapeLayer混合使用

UIBezierPath与CAShapeLayer混合使用

作者: Alienchang | 来源:发表于2016-02-24 11:30 被阅读158次

    一、使用CAShapeLayer绘制一个圆

    @property (nonatomic, strong) CAShapeLayer *circleShapeLayer;
    - (void)drawCircle{
        self.circleShapeLayer = [CAShapeLayer layer];
        UIBezierPath *circleBezierPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(50, 350, 100, 100)];//在区域内绘制椭圆曲线
        [circleBezierPath setLineWidth:1];
        [self.circleShapeLayer setPath:circleBezierPath.CGPath];
        [self.circleShapeLayer setStrokeColor:[UIColor redColor].CGColor];
        [self.circleShapeLayer setFillColor:[UIColor blackColor].CGColor];
        [self.circleShapeLayer setBorderWidth:1];
        [self.view.layer addSublayer:self.circleShapeLayer];
    }
     
    

    二、给圆加圆形进度条动画

    - (void)startCircleAnimation{
        CABasicAnimation *circleBasicAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
        [circleBasicAnimation setFromValue:@0];
        [circleBasicAnimation setToValue:@1];
        [circleBasicAnimation setDuration:5];
        [self.circleShapeLayer addAnimation:circleBasicAnimation   forKey:@""];
    }
    

    这时我们会发现进度条的起始点不是在顶端,把circleBezierPath的初始化改成以下即可

    UIBezierPath *circleBezierPath = [UIBezierPath bezierPathWithArcCenter:CGPointMake(160, 200) radius:50 startAngle:- M_PI / 2 endAngle:3 / 2. * M_PI clockwise:YES];
    

    demo链接https://github.com/Alienchang/BezierPathDemo

    相关文章

      网友评论

          本文标题:UIBezierPath与CAShapeLayer混合使用

          本文链接:https://www.haomeiwen.com/subject/jyhikttx.html