iOS关于贝塞尔曲线的使用

由于本人比较懒，很少写博客，由于一个朋友公司需要实现下面这个等级效果，自己也闲来无聊，就用UIBezierPath实现了，并做个记录。直接上代码吧

//创建贝塞尔路径

UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(centerX, centerY) radius:radius startAngle:(0.5f*M_PI) endAngle:2.5f*M_PI clockwise:YES];

//添加背景圆环

CAShapeLayer *backLayer = [CAShapeLayer layer];

backLayer.frame = self.bounds;

backLayer.fillColor =  [[UIColor clearColor] CGColor];

backLayer.strokeColor  = [UIColor colorWithRed:26.0/255.0f green:126.0/255.0f blue:255.0/255.0f alpha:1].CGColor;

backLayer.lineWidth = _lineWidth;

backLayer.path = [path CGPath];

backLayer.strokeEnd = 1;

[self.layer addSublayer:backLayer];

//设置渐变颜色

CAGradientLayer *gradientLayer =  [CAGradientLayer layer];

gradientLayer.frame = self.bounds;

[gradientLayer setColors:[NSArray arrayWithObjects:(id)[RGB(63, 204, 132) CGColor],(id)[RGB(98, 254, 52) CGColor], nil]];

gradientLayer.startPoint = CGPointMake(0, 0);

gradientLayer.endPoint = CGPointMake(0, 1);

[gradientLayer setMask:_proLayer]; //用progressLayer来截取渐变层

[self.layer addSublayer:gradientLayer];

//添加火柴棍

-(void)initTheLines

{

float radius = (self.bounds.size.width-30)/2.0f;

float sRadius = (self.bounds.size.width-20)/2.0f;

float bRadius = self.bounds.size.width/2.0f;

UIBezierPath *path = [[UIBezierPath alloc] init];

for (int i=1; i<20; i++)

{

[path moveToPoint:CGPointMake(15+radius-radius*sinf(i*2*M_PI/20),15+radius+radius*cosf(i*2*M_PI/20))];

if (i==5 || i==10 || i==15 || i==20)

{

[path addLineToPoint:CGPointMake(bRadius-bRadius*sinf(i*2*M_PI/20), bRadius+bRadius*cosf(i*2*M_PI/20))];

}

else

{

[path addLineToPoint:CGPointMake(10+sRadius-sRadius*sinf(i*2*M_PI/20), 10+sRadius+sRadius*cosf(i*2*M_PI/20))];

}

}

CAShapeLayer *shapeLayer = [CAShapeLayer layer];

shapeLayer.strokeColor = [UIColor colorWithRed:26.0/255.0f green:126.0/255.0f blue:255.0/255.0f alpha:1].CGColor;

shapeLayer.fillColor = [UIColor clearColor].CGColor;

shapeLayer.lineWidth = 5;

shapeLayer.lineJoin = kCALineJoinRound;

shapeLayer.lineCap = kCALineCapRound;

shapeLayer.path = path.CGPath;

//add it to our view

[self.layer addSublayer:shapeLayer];

}