先直接上效果图（可用于文件下载进度简单显示）：
代码部分也很简单，写成一个工具类 .h文件属性部分均可自定义
.h 文件
@interface FTCycleView : UIView
@property (nonatomic, strong) UILabel *progresslabel; /**< 显示进度的Label */
@property (nonatomic, strong) UIColor *fillColor; /**< 填充颜色 */
@property (nonatomic, strong) UIColor *strokeColor; /**< 边框路径颜色 */
@property (nonatomic, assign) CGFloat lineWidth; /**< 线的宽度 */
/** 绘制环形进度条
progress:进度值 0~1.0
*/
- (void)drawCycleProgress:(CGFloat)progress;
@end
.m 文件
@interface FTCycleView () {
CGFloat preProgress; /**< 先前进度 */
}
@implementation FTCycleView
#pragma mark - get
- (instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame: frame]) {
/* 设置默认颜色和环形进度条宽度 */
preProgress = 0;
_fillColor = [UIColor clearColor];
_strokeColor = [UIColor greenColor];
_lineWidth = 10;
}
return self;
}
/** 显示进度的Label */
- (UILabel *)progresslabel {
if (_progresslabel == nil) {
_progresslabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.frame.size.width*0.8, self.frame.size.height*0.4)];
_progresslabel.textAlignment = NSTextAlignmentCenter;
_progresslabel.center = CGPointMake(self.frame.size.width/2, self.frame.size.height/2);
[_progresslabel setFont:[UIFont systemFontOfSize:10.0*(self.frame.size.width/35.0)]];
[self addSubview:_progresslabel];
}
return _progresslabel;
}
/** 绘制环形进度条
progress:进度值 0~1.0
*/
- (void)drawCycleProgress:(CGFloat)progress {
self.progresslabel.text = [NSString stringWithFormat:@"%.0f%%",progress*100];
// 获取环形路径 （画一个圆 填充色透明 设置线框宽度为10，获得环形）
CAShapeLayer *progressLayer = [CAShapeLayer layer];
progressLayer.frame = self.bounds;
progressLayer.fillColor = self.fillColor.CGColor; // 填充颜色
progressLayer.strokeColor = self.strokeColor.CGColor; // 边框路径颜色
// _progressLayer.opacity = 1; // 背景颜色的透明度
progressLayer.lineCap = kCALineCapRound; // 线的边缘是圆的
progressLayer.lineWidth = self.lineWidth; // 线的宽度
CGPoint center = CGPointMake(self.frame.size.width/2, self.frame.size.width/2);
CGFloat radius = self.frame.size.width/2;
CGFloat startA = - M_PI_2 + M_PI*2*preProgress; // 起始点
CGFloat endA = - M_PI_2 + M_PI*2*progress; // 终点
preProgress = progress;
// 绘制
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius
startAngle:startA endAngle:endA clockwise:YES];
progressLayer.path = path.CGPath;
[self.layer addSublayer: progressLayer];
// 动画效果
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
animation.fromValue = @(0.0);
animation.toValue = @(1.0);
animation.duration = 0.1;
[progressLayer addAnimation:animation forKey:nil];
}
在其他ViewController中调用
#import "ViewController.h"
#import "FTCycleView.h"
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
[self cycleProgressTest];
}
/**
模拟下载显示 环形进度条
实际应用中只需调用下面方法 传入当前下载进度值即可
[cycleView drawCycleProgress:(当前下载进度值)];
*/
- (void)cycleProgressTest {
FTCycleView *cycleView = [[FTCycleView alloc] initWithFrame:CGRectMake(100, 100, 200, 200)];
[self.view addSubview:cycleView];
__block NSInteger progress = 0;
[NSTimer scheduledTimerWithTimeInterval:0.5 repeats:YES block:^(NSTimer * _Nonnull timer) {
progress = progress + 10;
if (progress <= 100) {
// 实际应用中只需调用下面方法 传入当前下载进度值即可
[cycleView drawCycleProgress:progress/100.0];
} else {
[timer invalidate];
}
}];
}
@end
