先直接上效果圖（可用于文件下載進(jìn)度簡(jiǎn)單顯示）：
代碼部分也很簡(jiǎn)單涉枫，寫成一個(gè)工具類 .h文件屬性部分均可自定義
.h 文件
@interface FTCycleView : UIView
@property (nonatomic, strong) UILabel *progresslabel; /**< 顯示進(jìn)度的Label */
@property (nonatomic, strong) UIColor *fillColor; /**< 填充顏色 */
@property (nonatomic, strong) UIColor *strokeColor; /**< 邊框路徑顏色 */
@property (nonatomic, assign) CGFloat lineWidth; /**< 線的寬度 */
/** 繪制環(huán)形進(jìn)度條
progress:進(jìn)度值 0~1.0
*/
- (void)drawCycleProgress:(CGFloat)progress;
@end
.m 文件
@interface FTCycleView () {
CGFloat preProgress; /**< 先前進(jìn)度 */
}
@implementation FTCycleView
#pragma mark - get
- (instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame: frame]) {
/* 設(shè)置默認(rèn)顏色和環(huán)形進(jìn)度條寬度 */
preProgress = 0;
_fillColor = [UIColor clearColor];
_strokeColor = [UIColor greenColor];
_lineWidth = 10;
}
return self;
}
/** 顯示進(jìn)度的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;
}
/** 繪制環(huán)形進(jìn)度條
progress:進(jìn)度值 0~1.0
*/
- (void)drawCycleProgress:(CGFloat)progress {
self.progresslabel.text = [NSString stringWithFormat:@"%.0f%%",progress*100];
// 獲取環(huán)形路徑 （畫一個(gè)圓 填充色透明 設(shè)置線框?qū)挾葹?0墨坚，獲得環(huán)形）
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; // 起始點(diǎn)
CGFloat endA = - M_PI_2 + M_PI*2*progress; // 終點(diǎn)
preProgress = progress;
// 繪制
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius
startAngle:startA endAngle:endA clockwise:YES];
progressLayer.path = path.CGPath;
[self.layer addSublayer: progressLayer];
// 動(dòng)畫效果
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
animation.fromValue = @(0.0);
animation.toValue = @(1.0);
animation.duration = 0.1;
[progressLayer addAnimation:animation forKey:nil];
}
在其他ViewController中調(diào)用
#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];
}
/**
模擬下載顯示 環(huán)形進(jìn)度條
實(shí)際應(yīng)用中只需調(diào)用下面方法 傳入當(dāng)前下載進(jìn)度值即可
[cycleView drawCycleProgress:(當(dāng)前下載進(jìn)度值)];
*/
- (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) {
// 實(shí)際應(yīng)用中只需調(diào)用下面方法 傳入當(dāng)前下載進(jìn)度值即可
[cycleView drawCycleProgress:progress/100.0];
} else {
[timer invalidate];
}
}];
}
@end
