iOS实现圆环比例图

 更新时间:2020年11月26日 10:04:12   作者:欧生1539  
这篇文章主要为大家详细介绍了iOS实现圆环比例图,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了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];
  }
}

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

您可能感兴趣的文章:

相关文章

  • IOS UIView的生命周期的实例详解

    IOS UIView的生命周期的实例详解

    这篇文章主要介绍了IOS UIView的生命周期的实例详解的相关资料,希望通过本文大家能掌握理解这部分内容,需要的朋友可以参考下
    2017-09-09
  • Xcode8打印一堆log问题的快速解决方法

    Xcode8打印一堆log问题的快速解决方法

    刚装的xcode8,不知道从哪来的一堆log,很奇怪。怎么解决此问题呢?下面小编给大家分享本教程帮助大家了解Xcode8打印一堆log问题的快速解决方法,感兴趣的朋友跟着小编一起学习吧
    2016-10-10
  • yii框架分类树扩展示例

    yii框架分类树扩展示例

    这篇文章主要介绍了yii框架分类树扩展示例,提供两种方式的分类树格式,表格和下拉框形式的树形结构,需要的朋友可以参考下
    2014-04-04
  • iOS开发之App主题切换解决方案完整版(Swift版)

    iOS开发之App主题切换解决方案完整版(Swift版)

    这篇文章主要为大家详细介绍了iOS开发之App主题切换完整解决方案,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-02-02
  • IOS自定义UIButton九宫格效果

    IOS自定义UIButton九宫格效果

    这篇文章主要介绍了IOS自定义UIButton九宫格效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-12-12
  • iOS中管理剪切板的UIPasteboard粘贴板类用法详解

    iOS中管理剪切板的UIPasteboard粘贴板类用法详解

    在iOS中,通过UITextField、UITextView和UIWebView剪切或复制的内容都可以通过UIPasteboard类来管理粘贴操作,下面就为大家带来iOS中管理剪切板的UIPasteboard粘贴板类用法详解:
    2016-06-06
  • 判断iPhone的WiFi是否打开的两种方法

    判断iPhone的WiFi是否打开的两种方法

    大家都知道判断WiFi是否连接可以使用Reachability进行判断,那么wifi是否打开应该怎么判断呢?下面小编给大家分享两种完全基于不同思路的方法,需要的朋友参考下
    2016-11-11
  • iOS开发之获取系统相册中的图片与视频教程(内带url转换)

    iOS开发之获取系统相册中的图片与视频教程(内带url转换)

    本篇文章主要介绍了iOS开发之获取系统相册中的图片与视频教程(内带url转换),主要介绍AssetsLibrary 框架,具有一定的参考价值,有需要的可以了解一下。
    2016-11-11
  • iOS利用Runtime实现友盟页面数据统计的功能示例

    iOS利用Runtime实现友盟页面数据统计的功能示例

    这篇文章主要给大家介绍了关于iOS利用Runtime实现友盟页面数据统计功能的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2018-01-01
  • IOS实现选择城市后跳转Tabbar效果

    IOS实现选择城市后跳转Tabbar效果

    这篇文章主要为大家详细介绍了IOS实现选择城市后跳转Tabbar效果的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-07-07

最新评论