iOS 不同颜色之分段式圆环，段数不固定

  最近美工那边提出一个需求，就是需要展示资产的占比，通过一个圆环展示，于是自己便封装了一个。段数不限制，只需赋值所占比例及该段的颜色即可。

     直接上代码：

    #import"ColorCircleView.h"

    

    float a=301.25,b=235.23,c=452.65;

    ColorCircleView *view = [[ColorCircleViewalloc]initWithFrame:CGRectMake(100,200,100, 100)];

    view.circleArray =@[

                           @{

                             @"strokeColor":[UIColorredColor],

                             @"precent"    :@(a/(a+b+c))

                             },

                           @{

                             @"strokeColor":[UIColororangeColor],

                             @"precent"    :@(b/(a+b+c))

                             },

                           @{

                             @"strokeColor":[UIColoryellowColor],

                             @"precent"    :@(c/(a+b+c))

                             }

                       ];

    [self.viewaddSubview:view];

    运行效果如下：

自定义一个分类继承UIView

下面是.h文件

#import <UIKit/UIKit.h>

@interface ColorCircleView : UIView

//数组里面装的是字典，，字典里有两个key -> strokeColor和precent

@property (nonatomic,assign)NSArray *circleArray;

@end

.m文件

#import "ColorCircleView.h"

@interface ColorCircleView ()

@property (nonatomic,strong)CAShapeLayer *shapeLayer;

@end

@implementation ColorCircleView

- (void)initType

{

    __blockfloat a =0;

    [self.circleArrayenumerateObjectsUsingBlock:^(NSDictionary  *obj,NSUInteger idx, BOOL *_Nonnull stop) {

        //创建出CAShapeLayer

        self.shapeLayer = [CAShapeLayerlayer];

        self.shapeLayer.frame =CGRectMake(0,0,self.bounds.size.width,self.bounds.size.height);//设置shapeLayer的尺寸和位置

        //    self.shapeLayer.position = self.view.center;

        self.shapeLayer.fillColor = [UIColorclearColor].CGColor;//填充颜色为ClearColor

        //设置线条的宽度和颜色

        self.shapeLayer.lineWidth =10.0f;

        self.shapeLayer.strokeColor = [obj[@"strokeColor"]CGColor];

        //创建出圆形贝塞尔曲线

        UIBezierPath *circlePath = [UIBezierPathbezierPathWithOvalInRect:CGRectMake(0,0,self.bounds.size.width,self.bounds.size.height)];

        //让贝塞尔曲线与CAShapeLayer产生联系

        self.shapeLayer.path = circlePath.CGPath;

        self.shapeLayer.strokeStart = a;

        self.shapeLayer.strokeEnd = [obj[@"precent"]floatValue] + a;

        a = self.shapeLayer.strokeEnd;

        //添加并显示

        [self.layeraddSublayer:self.shapeLayer];

        

        //添加圆环动画

        CABasicAnimation *pathAnimation = [CABasicAnimationanimationWithKeyPath:@"strokeEnd"];

        pathAnimation.duration =1.0;

        pathAnimation.fromValue =@(0);

        pathAnimation.toValue =@(1);

        pathAnimation.timingFunction = [CAMediaTimingFunctionfunctionWithName:kCAMediaTimingFunctionEaseOut];

        [self.shapeLayeraddAnimation:pathAnimationforKey:@"strokeEnd"];

    }];

}

- (void)setCircleArray:(NSArray *)circleArray

{

    _circleArray = circleArray;

    [selfinitType];

}

@end

以上便是全部，，如有更好的方法和建议，欢迎联系，，非常感谢！！！！