效果图：
progress.gif
UIBezierPath类简介
使用UIBezierPath类可以创建基于矢量的路径，这个类在UIKit中。此类是Core Graphics框架关于path的一个封装。使用此类可以定义简单的形状，如椭圆或者矩形，或者有多个直线和曲线段组成的形状。
1.Bezier Path 基础
UIBezierPath对象是CGPathRef数据类型的封装。path如果是基于矢量形状的，都用直线和曲线段去创建。我们使用直线段去创建矩形和多边形，使用曲线段去创建弧（arc），圆或者其他复杂的曲线形状。每一段都包括一个或者多个点，绘图命令定义如何去诠释这些点。每一个直线段或者曲线段的结束的地方是下一个的开始的地方。每一个连接的直线或者曲线段的集合成为subpath。一个UIBezierPath对象定义一个完整的路径包括一个或者多个subpaths。
创建和使用一个path对象的过程是分开的。创建path是第一步，包含一下步骤：
（1）创建一个Bezier path对象。
（2）使用方法moveToPoint:去设置初始线段的起点。
（3）添加line或者curve去定义一个或者多个subpaths。
（4）改变UIBezierPath对象跟绘图相关的属性。
例如，我们可以设置stroked path的属性lineWidth和lineJoinStyle。也可以设置filled path的属性usesEvenOddFillRule。
当创建path，我们应该管理path上面的点相对于原点（0，0），这样我们在随后就可以很容易的移动path了。为了绘制path对象，我们要用到stroke和fill方法。这些方法在current graphic context下渲染path的line和curve段。
2、使用UIBezierPath创建多边形---在path下面添加直线条形成多边形
多边形是一些简单的形状,这些形状是由一些直线线条组成，我们可以用moveToPoint: 和 addLineToPoint:方法去构建。
方法moveToPoint:设置我们想要创建形状的起点。从这点开始，我们可以用方法addLineToPoint:去创建一个形状的线段。
我们可以连续的创建line，每一个line的起点都是先前的终点，终点就是指定的点。
代码实现：
HYCircleProgressView.h文件
#import <UIKit/UIKit.h>
@interface HYCircleProgressView : UIView
/**
*进度条宽度
*/
@property (nonatomic,assign) CGFloat progressLineWidth;
/**
* 背景线条宽度
*/
@property (nonatomic,assign) CGFloat backgroundLineWidth;
/**
* 进度百分比
*/
@property (nonatomic,assign) CGFloat percentage;
/**
* 背景填充颜色
*/
@property (nonatomic,strong) UIColor *backgroundStrokeColor;
/**
* 进度条填充颜色
*/
@property (nonatomic,strong) UIColor *progressStrokeColor;
/**
* 距离边框边距偏移量
*/
@property (nonatomic,assign) CGFloat offset;
/**
* 步长
*/
@property (nonatomic,assign) CGFloat step;
/**
* 数字字体颜色
*/
@property (nonatomic,strong) UIColor *digitTintColor;
- (void)setProgress:(CGFloat)percentage animated:(BOOL)animated;
@end
HYCircleProgressView.m文件
#import "HYCircleProgressView.h"
#define kDuration 2.0
#define kDefaultLineWidth 10
@interface HYCircleProgressView()
@property (nonatomic,strong) CAShapeLayer *backgroundLayer;
@property (nonatomic,strong) CAShapeLayer *progressLayer;
@property (nonatomic,strong) UILabel *progressLabel;
@property (nonatomic,assign) CGFloat sumSteps;
@property (nonatomic,strong) NSTimer *timer;
@end
@implementation HYCircleProgressView
- (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
[self setBackgroundColor:[UIColor clearColor]];
[self createSubViews];
//init default variable
self.backgroundLineWidth = kDefaultLineWidth;
self.progressLineWidth = kDefaultLineWidth;
self.percentage = 0;
self.offset = 0;
self.sumSteps = 0;
self.step = 0.1;
}
return self;
}
- (void)createSubViews
{
self.progressLabel.text = @"0%";
self.progressLabel.textAlignment = NSTextAlignmentCenter;
self.progressLabel.font = [UIFont systemFontOfSize:25 weight:0.4];
[self addSubview:self.progressLabel];
_backgroundLayer = [CAShapeLayer layer];
_backgroundLayer.frame = self.bounds;
_backgroundLayer.fillColor = nil;
_backgroundLayer.strokeColor = [UIColor lightGrayColor].CGColor;
_progressLayer = [CAShapeLayer layer];
_progressLayer.frame = self.bounds;
_progressLayer.fillColor = nil;
_progressLayer.strokeColor = [UIColor redColor].CGColor;
[self.layer addSublayer:_backgroundLayer];
[self.layer addSublayer:_progressLayer];
}
#pragma mark - draw circleLine
- (void)setBackgroundCircleLine
{
UIBezierPath *path = [UIBezierPath bezierPath];
path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.center.x - self.frame.origin.x, self.center.y - self.frame.origin.y)
radius:(self.frame.size.width - _backgroundLineWidth)/2 - _offset
startAngle:0
endAngle:M_PI*2
clockwise:YES];
_backgroundLayer.path = path.CGPath;
}
- (void)setProgressCircleLine
{
UIBezierPath *path = [UIBezierPath bezierPath];
path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.center.x - self.frame.origin.x, self.center.y - self.frame.origin.y)
radius:(self.frame.size.width - _progressLineWidth)/2 - _offset
startAngle:-M_PI_2
endAngle:-M_PI_2 + M_PI *2
clockwise:YES];
_progressLayer.path = path.CGPath;
}
#pragma mark -setter and get method
- (UILabel *)progressLabel
{
if (!_progressLabel) {
_progressLabel = [[UILabel alloc]initWithFrame:CGRectMake((self.bounds.size.width -100)/2, (self.bounds.size.height - 100)/2, 100, 100)];
}
return _progressLabel;
}
- (void)setDigitTintColor:(UIColor *)digitTintColor
{
_digitTintColor = digitTintColor;
_progressLabel.textColor = _digitTintColor;
}
- (void)setBackgroundLineWidth:(CGFloat)backgroundLineWidth
{
_backgroundLineWidth = backgroundLineWidth;
_backgroundLayer.lineWidth = _backgroundLineWidth;
[self setBackgroundCircleLine];
}
- (void)setProgressLineWidth:(CGFloat)progressLineWidth
{
_progressLineWidth = progressLineWidth;
_progressLayer.lineWidth = _progressLineWidth;
[self setProgressCircleLine];
}
- (void)setPercentage:(CGFloat)percentage
{
_percentage = percentage;
}
- (void)setBackgroundStrokeColor:(UIColor *)backgroundStrokeColor
{
_backgroundStrokeColor = backgroundStrokeColor;
_backgroundLayer.strokeColor = _backgroundStrokeColor.CGColor;
}
- (void)setProgressStrokeColor:(UIColor *)progressStrokeColor
{
_progressStrokeColor = progressStrokeColor;
_progressLayer.strokeColor = _progressStrokeColor.CGColor;
}
#pragma mark - progress animated YES or NO
- (void)setProgress:(CGFloat)percentage animated: (BOOL)animated
{
self.percentage = percentage;
_progressLayer.strokeEnd = _percentage;
if (animated) {
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
animation.fromValue = [NSNumber numberWithFloat:0.0];
animation.toValue = [NSNumber numberWithFloat:_percentage];
animation.duration = kDuration;
//start timer
_timer = [NSTimer scheduledTimerWithTimeInterval:_step
target:self
selector:@selector(numberAnimation)
userInfo:nil
repeats:YES];
[_progressLayer addAnimation:animation forKey:@"strokeEndAnimation"];
}else{
[CATransaction begin];
[CATransaction setDisableActions:YES];
_progressLabel.text = [NSString stringWithFormat:@"%.0f%%",_percentage*100];
[CATransaction commit];
}
}
- (void)numberAnimation
{
_sumSteps += _step;
float sumSteps = (_percentage/kDuration)*_sumSteps;
_progressLabel.text = [NSString stringWithFormat:@"%.0f%%",sumSteps*100];
if (_sumSteps >= kDuration) {
//close timer
[_timer invalidate];
_timer = nil;
return;
}
}
@end
demo地址:https://github.com/huanghaiyan/HYCircleProgressView-master
