1.绘图
创建一个进度条View在.h中声明如下：
#import@interface CircleProgress : UIView
{
CGContextRef ctx;
}
@property (nonatomic, assign) float lineWidth;
@property (nonatomic, strong) UIColor *lineColor;
@property (nonatomic, assign) float startAngle;
@property (nonatomic, assign) float endAngle;
@end
.m实现如下
- (void)drawRect:(CGRect)rect {
// Drawing code
if (_startAngle == 0)
{
_startAngle = 0;
}
if (_endAngle == 0)
{
_endAngle = 360.0f;
}
if (_lineWidth == 0)
{
_lineWidth = 3;
}
if (_lineColor == nil)
{
_lineColor = [UIColor blackColor];
}
ctx = UIGraphicsGetCurrentContext();
CGContextBeginPath(ctx);
[_lineColor set];// 两种设置颜色的方式都可以
CGContextSetLineWidth(ctx, _lineWidth); // 线的宽度
CGContextSetLineCap(ctx, kCGLineCapRound);
//图形上下文，x,y为圆点坐标，半径 startAngle为开始的弧度，endAngle为 结束的弧度，clockwise 0为顺时针，1为逆时针
CGContextAddArc(ctx, self.frame.size.width/2, self.frame.size.height/2, self.frame.size.width/2 - _lineWidth , _startAngle / (180/M_PI),_endAngle /(180/M_PI), 0);
CGContextSetFillColorWithColor(ctx, [UIColor blueColor].CGColor);
CGContextStrokePath(ctx);
CGContextAddArc(ctx,self.frame.size.width/2, self.frame.size.height/2, 10, 0, 2 * M_PI, 1);
CGContextSetFillColorWithColor(ctx, _lineColor.CGColor);
CGContextFillPath(ctx);
}
-(void)setEndAngle:(float)endAngle
{
_endAngle = endAngle;
[self setNeedsDisplay];
}
-(void)setStartAngle:(float)startAngle
{
_startAngle = startAngle;
[self setNeedsDisplay];
}
-(void)setLineWidth:(float)lineWidth
{
_lineWidth = lineWidth ;
[self setNeedsDisplay];
}
-(void)setLineColor:(UIColor *)lineColor
{
_lineColor = lineColor;
[self setNeedsDisplay];
}
具体实现如下：
_circleProgressView = [[CircleProgress alloc] initWithFrame:CGRectMake(40, 30, 240, 240)];
_circleProgressView.backgroundColor = [UIColor redColor];
_circleProgressView.lineWidth = 25;
_circleProgressView.lineColor = [UIColor blackColor];
_circleProgressView.startAngle = 0;
_circleProgressView.endAngle = 360;
[self.view addSubview:_circleProgressView];
第一种方法完工。
2.换汤不换药的再来一种 用UIBezierPath来实现
- (void)drawRect:(CGRect)rect {
// Drawing code
CGContextRef ref = UIGraphicsGetCurrentContext();
CGContextBeginPath(ref);
[[UIColor blueColor] set];
CGContextSetLineWidth(ref, 10);
CGContextSetLineCap(ref, kCGLineCapRound);
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.frame.size.width/2, self.frame.size.height/2) radius:self.frame.size.width/2 - 10 startAngle:0 endAngle:_endAngle/180.0 *M_PI clockwise:YES];
CGContextAddPath(ref, path.CGPath);
CGContextStrokePath(ref);
}
- (void)setEndAngle:(CGFloat)endAngle
{
_endAngle = endAngle;
[self setNeedsDisplay];
}
3.用layer来完成
用layer来完成相应的纯色进度条比较方便快捷。
//创建CAShapeLayer
CAShapeLayer *layer = [CAShapeLayer layer];
layer.frame = CGRectMake(0, 0, 200, 200);
//创建路径
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:self.center radius:self.frame.size.width/2 - 10 startAngle:0 endAngle:M_PI clockwise:YES];
layer.path = path.CGPath;
layer.lineWidth = 9;
layer.fillColor=[UIColor clearColor].CGColor;
layer.strokeColor=[UIColor colorWithRed:0.76f green:0.89f blue:0.89f alpha:1.00f].CGColor;
layer.lineCap = kCALineCapRound;
layer.lineJoin = kCALineJoinRound;
[sel.view.layer addSublayer:layer];
