由于本人比較懶,很少寫博客彼乌,由于一個(gè)朋友公司需要實(shí)現(xiàn)下面這個(gè)等級(jí)效果,自己也閑來無聊渊迁,就用UIBezierPath實(shí)現(xiàn)了慰照,并做個(gè)記錄。直接上代碼吧
//創(chuàng)建貝塞爾路徑
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(centerX, centerY) radius:radius startAngle:(0.5f*M_PI) endAngle:2.5f*M_PI clockwise:YES];
//添加背景圓環(huán)
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];
//設(shè)置漸變顏色
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];
}