简单的实现环形比例图

//初始化
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 <UIKit/UIKit.h>


@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



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值