iOS实现圆环比例图

时间:2021-05-20

本文实例为大家分享了iOS实现圆环比例图的具体代码,供大家参考,具体内容如下

实现效果

实现方法

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]; }}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章