简单的实现环形比例图

//初始化

ProportionLoopView *loopView = [[ ProportionLoopView alloc ] initWithFrame : CGRectMake ( 0 , 0 , 100 , 100 )];

    loopView. backgroundColor = [ UIColor clearColor ];

    loopView. center = self . view . center ;

    loopView. ringWidth = 30 ;

    [ self . view addSubview :loopView];

    [loopView drawProgress : 0.3 withColor :[ UIColor redColor ] color :[ UIColor orangeColor ]];

#import

@interface ProportionLoopView : UIView

- (void)drawProgress:(CGFloat )progress withColor:(UIColor *)colorFirst color:(UIColor *)colorSecond;

@property (nonatomic, assign) CGFloat ringWidth;//环宽度

@end

#import "ProportionLoopView.h"

@interface ProportionLoopView ()

@property (nonatomic, assign) CGFloat progress;//比例 0~1

@property (nonatomic, strong) UIColor *colorOne;

@property (nonatomic, strong) UIColor *colorTwo;

@property (nonatomic, strong) CAShapeLayer *progressLayer;//环1

@property (nonatomic, strong) CAShapeLayer *progressLayerTwo;//环2

@end

@implementation ProportionLoopView

- (void)drawProgress:(CGFloat )progress withColor:(UIColor *)colorFirst color:(UIColor *)colorSecond{

    _progress = progress;

    _colorOne = colorFirst;

    _colorTwo = colorSecond;

    _progressLayer.opacity = 0;

    _progressLayerTwo.opacity = 0;

    [self setNeedsDisplay];

}

//初始化时执行

- (void)drawRect:(CGRect)rect {

    [self drawCycleProgress];

}

//绘制

- (void)drawCycleProgress{

    

    CGPoint center = CGPointMake(self.frame.size.width/2, self.frame.size.height/2);

    CGFloat radius = self.frame.size.width/2 - _ringWidth/2;

    CGFloat startA = - M_PI_2;  //设置进度条起点位置

    CGFloat endA = -M_PI_2 + M_PI * 2 * _progress;  //设置进度条终点位置

    

    //获取环形路径（画一个圆形，填充色透明，设置线框宽度为10，这样就获得了一个环形）

    _progressLayer = [CAShapeLayer layer];//创建一个track shape layer

    _progressLayer.frame = self.bounds;

    _progressLayer.fillColor = [[UIColor clearColor] CGColor];  //填充色为无色

    _progressLayer.strokeColor = [_colorOne CGColor]; //指定path的渲染颜色,这里可以设置任意不透明颜色

    _progressLayer.opacity = 1; //背景颜色的透明度

    //_progressLayer.lineCap = kCALineCapRound;//指定线的边缘是圆的

    _progressLayer.lineWidth = _ringWidth;//线的宽度

    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:startA endAngle:endA clockwise:YES];//上面说明过了用来构建圆形

    _progressLayer.path =[path CGPath]; //把path传递給layer，然后layer会处理相应的渲染，整个逻辑和CoreGraph是一致的。

    [self.layer addSublayer:_progressLayer];

    

    

    

    //获取环形路径（画一个圆形，填充色透明，设置线框宽度为10，这样就获得了一个环形）

    _progressLayerTwo = [CAShapeLayer layer];//创建一个track shape layer

    _progressLayerTwo.frame = self.bounds;

    _progressLayerTwo.fillColor = [[UIColor clearColor] CGColor];  //填充色为无色

    _progressLayerTwo.strokeColor = [_colorTwo CGColor]; //指定path的渲染颜色,这里可以设置任意不透明颜色

    _progressLayerTwo.opacity = 1; //背景颜色的透明度

    //_progressLayer.lineCap = kCALineCapRound;//指定线的边缘是圆的

    _progressLayerTwo.lineWidth = 30;//线的宽度

    UIBezierPath *pathtwso = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:endA endAngle:startA clockwise:YES];//上面说明过了用来构建圆形

    _progressLayerTwo.path =[pathtwso CGPath]; //把path传递給layer，然后layer会处理相应的渲染，整个逻辑和CoreGraph是一致的。

    [self.layer addSublayer:_progressLayerTwo];

    

}

@end