iOS實現(xiàn)圓環(huán)比例圖
更新時間:2020年11月26日 10:04:12 作者:歐生1539
這篇文章主要為大家詳細介紹了iOS實現(xiàn)圓環(huán)比例圖,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本文實例為大家分享了iOS實現(xiàn)圓環(huán)比例圖的具體代碼,供大家參考,具體內(nèi)容如下
實現(xiàn)效果


實現(xiàn)方法
1. SSTCircleProgressView
@interface SSTCircleProgressView : UIView /** *進度條的角的類型 */ @property (nonatomic,copy) CAShapeLayerLineCap lineCap; /** *進度條顯示的文字 */ @property (nonatomic,copy) NSString *progressLabelText; /** *進度條顯示的文字的顏色 */ @property (nonatomic,copy) UIColor *progressLabelTextColor; /** *進度條寬度 */ @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; - (void)setProgress:(CGFloat)percentage animated:(BOOL)animated; @end
#import "SSTCircleProgressView.h"
#define kDuration 1.0
#define kDefaultLineWidth 10
@interface SSTCircleProgressView()
@property (nonatomic,strong) CAShapeLayer *backgroundLayer;
@property (nonatomic,strong) CAShapeLayer *progressLayer;
@property (nonatomic,strong) UILabel *progressLabel;
@property (nonatomic,strong) NSTimer *timer;
@property (nonatomic,assign) CGFloat startAngle ; // M_PI*2
@property (nonatomic,assign) CGFloat endAngle ;
@end
@implementation SSTCircleProgressView
- (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.startAngle = -M_PI_2;
self.endAngle = 0;
}
return self;
}
- (void)createSubViews
{
//self.progressLabel.text = @"0%";
self.progressLabel.textAlignment = NSTextAlignmentCenter;
self.progressLabel.font = FONTBOLD(12);
[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];
}
-(void)setProgressLabelText:(NSString *)progressLabelText{
_progressLabelText = progressLabelText;
self.progressLabel.text = progressLabelText;
}
-(void)setProgressLabelTextColor:(UIColor *)progressLabelTextColor{
_progressLabelTextColor = progressLabelTextColor;
self.progressLabel.textColor = progressLabelTextColor;
}
#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:self.startAngle
endAngle:self.endAngle
clockwise:NO];
_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:self.startAngle
endAngle:self.endAngle
clockwise:NO];
_progressLayer.path = path.CGPath;
}
#pragma mark - Lazy Load
- (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)setBackgroundLineWidth:(CGFloat)backgroundLineWidth
{
_backgroundLineWidth = backgroundLineWidth;
_backgroundLayer.lineWidth = _backgroundLineWidth;
[self setBackgroundCircleLine];
}
-(void)setLineCap:(CAShapeLayerLineCap)lineCap{
_progressLayer.lineCap = lineCap;
[self setProgressCircleLine];
}
- (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;
[_progressLayer addAnimation:animation forKey:@"strokeEndAnimation"];
}else{
[CATransaction begin];
[CATransaction setDisableActions:YES];
_progressLabel.text = [NSString stringWithFormat:@"%.0f%%",_percentage*100];
[CATransaction commit];
}
}
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關(guān)文章
iOS開發(fā)之App主題切換解決方案完整版(Swift版)
這篇文章主要為大家詳細介紹了iOS開發(fā)之App主題切換完整解決方案,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-02-02
iOS中管理剪切板的UIPasteboard粘貼板類用法詳解
在iOS中,通過UITextField、UITextView和UIWebView剪切或復(fù)制的內(nèi)容都可以通過UIPasteboard類來管理粘貼操作,下面就為大家?guī)韎OS中管理剪切板的UIPasteboard粘貼板類用法詳解:2016-06-06
iOS開發(fā)之獲取系統(tǒng)相冊中的圖片與視頻教程(內(nèi)帶url轉(zhuǎn)換)
本篇文章主要介紹了iOS開發(fā)之獲取系統(tǒng)相冊中的圖片與視頻教程(內(nèi)帶url轉(zhuǎn)換),主要介紹AssetsLibrary 框架,具有一定的參考價值,有需要的可以了解一下。2016-11-11
iOS利用Runtime實現(xiàn)友盟頁面數(shù)據(jù)統(tǒng)計的功能示例
這篇文章主要給大家介紹了關(guān)于iOS利用Runtime實現(xiàn)友盟頁面數(shù)據(jù)統(tǒng)計功能的相關(guān)資料,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2018-01-01
IOS實現(xiàn)選擇城市后跳轉(zhuǎn)Tabbar效果
這篇文章主要為大家詳細介紹了IOS實現(xiàn)選擇城市后跳轉(zhuǎn)Tabbar效果的相關(guān)資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-07-07

