先把自定义控件的功力图贴出来

iOS 自定义控件 progressView(环形进度条)

之前做项目的时候有用到环形进度条,先是在网上找了一下第三方控件,发现好用是好用,就是东西太多了,有点复杂,还不如自己写一个简单点适合自己用的。

先把自定义控件的效果图贴出来。

金沙网址 1金沙网址,
金沙网址 2

其实我写的这个控件很简单。索性就直接把源码贴出来吧。

.h文件的内容就是一些声明

#import

@interface ProgressView : UIView

//中心颜色

@property (strong, nonatomic)UIColor *centerColor;

//圆环背景色

@property (strong, nonatomic)UIColor *arcBackColor;

//圆环色

@property (strong, nonatomic)UIColor *arcFinishColor;

@property (strong, nonatomic)UIColor *arcUnfinishColor;

//百分比数值(0-1)

@property (assign, nonatomic)float percent;

//圆环宽度

@property (assign, nonatomic)float width;

@end

.m文件里就是具体实现了

#import “ProgressView.h”

@implementation ProgressView

– (id)initWithFrame:(CGRect)frame{

self = [super initWithFrame:frame];

if (self) {

self.backgroundColor = ClearColor;

_percent = 0;

_width = 0;

}

return self;

}

– (void)setPercent:(float)percent{

_percent = percent;

[self setNeedsDisplay];

}

– (void)drawRect:(CGRect)rect{

[self addArcBackColor];

[self drawArc];

[self addCenterBack];

[self addCenterLabel];

}

– (void)addArcBackColor{

CGColorRef color = (_arcBackColor == nil) ? [UIColor
lightGrayColor].CGColor : _arcBackColor.CGColor;

CGContextRef contextRef = UIGraphicsGetCurrentContext();

CGSize viewSize = self.bounds.size;

CGPoint center = CGPointMake(viewSize.width / 2, viewSize.height / 2);

// Draw the slices.

CGFloat radius = viewSize.width / 2;

CGContextBeginPath(contextRef);

CGContextMoveToPoint(contextRef, center.x, center.y);

CGContextAddArc(contextRef, center.x, center.y, radius, 0,2*M_PI, 0);

CGContextSetFillColorWithColor(contextRef, color);

CGContextFillPath(contextRef);

}

– (void)drawArc{

if (_percent == 0 || _percent > 1) {

return;

}

if (_percent == 1) {

CGColorRef color = (_arcFinishColor == nil) ? [UIColor
greenColor].CGColor : _arcFinishColor.CGColor;

CGContextRef contextRef = UIGraphicsGetCurrentContext();

CGSize viewSize = self.bounds.size;

CGPoint center = CGPointMake(viewSize.width / 2, viewSize.height / 2);

// Draw the slices.

CGFloat radius = viewSize.width / 2;

CGContextBeginPath(contextRef);

CGContextMoveToPoint(contextRef, center.x, center.y);

CGContextAddArc(contextRef, center.x, center.y, radius, 0,2*M_PI, 0);

CGContextSetFillColorWithColor(contextRef, color);

CGContextFillPath(contextRef);

}else{

float endAngle = 2*M_PI*_percent;

CGColorRef color = (_arcUnfinishColor == nil) ? [UIColor
blueColor].CGColor : _arcUnfinishColor.CGColor;

CGContextRef contextRef = UIGraphicsGetCurrentContext();

CGSize viewSize = self.bounds.size;

CGPoint center = CGPointMake(viewSize.width / 2, viewSize.height / 2);

// Draw the slices.

CGFloat radius = viewSize.width / 2;

CGContextBeginPath(contextRef);

CGContextMoveToPoint(contextRef, center.x, center.y);

CGContextAddArc(contextRef, center.x, center.y, radius, 0,endAngle, 0);

CGContextSetFillColorWithColor(contextRef, color);

CGContextFillPath(contextRef);

}

}

-(void)addCenterBack{

float width = (_width == 0) ? 5 : _width;

CGColorRef color = (_centerColor == nil) ? [UIColor
whiteColor].CGColor : _centerColor.CGColor;

CGContextRef contextRef = UIGraphicsGetCurrentContext();

CGSize viewSize = self.bounds.size;

CGPoint center = CGPointMake(viewSize.width / 2, viewSize.height / 2);

// Draw the slices.

CGFloat radius = viewSize.width / 2 – width;

CGContextBeginPath(contextRef);

CGContextMoveToPoint(contextRef, center.x, center.y);

CGContextAddArc(contextRef, center.x, center.y, radius, 0,2*M_PI, 0);

CGContextSetFillColorWithColor(contextRef, color);

CGContextFillPath(contextRef);

}

– (void)addCenterLabel{

NSString *percent = @””;

float fontSize = 14;

UIColor *arcColor = [UIColor blueColor];

if (_percent == 1) {

percent = @”100%”;

fontSize = 14;

arcColor = (_arcFinishColor == nil) ? [UIColor greenColor] :
_arcFinishColor;

}else if(_percent < 1 && _percent >= 0){

fontSize = 13;

arcColor = (_arcUnfinishColor == nil) ? [UIColor blueColor] :
_arcUnfinishColor;

percent = [NSString stringWithFormat:@”%0.2f%%”,_percent*100];

}

CGSize viewSize = self.bounds.size;

NSMutableParagraphStyle *paragraph = [[NSMutableParagraphStyle
alloc] init];

paragraph.alignment = NSTextAlignmentCenter;

NSDictionary *attributes = [NSDictionary
dictionaryWithObjectsAndKeys:[UIFont
boldSystemFontOfSize:fontSize],NSFontAttributeName
,arcColor,NSForegroundColorAttributeName,[UIColor
clearColor],NSBackgroundColorAttributeName,paragraph,NSParagraphStyleAttributeName,nil];

[percent drawInRect:CGRectMake(5, (viewSize.height-fontSize)/2,
viewSize.width-10, fontSize) withAttributes:attributes];

}

@end

具体的调用就是

ProgressView *progress = [[ProgressView
alloc]initWithFrame:CGRectMake(detil.width-65, 10, 60, 60)];

progress.arcFinishColor = COLOR_STRING(@”#75AB33″);

progress.arcUnfinishColor = COLOR_STRING(@”#0D6FAE”);

progress.arcBackColor = COLOR_STRING(@”#EAEAEA”);

progress.percent = 1;

[detil addSubview:progress];

当然这些都有默认值,也可以不设置。
当然这么简单肯定会有缺陷,所以如果你有发现什么问题,或更好地方法可以提出来大家一起研究。
最后,如果你不想粘贴代码,那么源码我也已经上传到资源。
progressView 资源:空间传送门
最后的最后,感谢你一直看到结尾 —— LC

自定义控件 progressView(环形进度条)
之前做项目的时候有用到环形进度条,先是在网上找了一下第三方控件,发现好用是好用,就是东西…

相关文章