码迷,mamicode.com
首页 > 其他好文 > 详细

通过布赛尔曲线以及CAShapeLayer的strokeStart 、strokeEnd 属性来实现一个圆形进度条

时间:2015-04-01 17:21:36      阅读:104      评论:0      收藏:0      [点我收藏+]

标签:

#import <UIKit/UIKit.h>

@interface CircleProgressView : UIView

/**起始值(0-1)*/
@property(nonatomic,assign)CGFloat fstartValue;

/**边框宽度*/
@property(nonatomic,assign)CGFloat flineWidth;

/**线条颜色*/
@property(nonatomic,strong)UIColor *lineColor;

/**变化的值*/
@property(nonatomic,assign)CGFloat fvalue;
@end
#import "CircleProgressView.h"
@interface CircleProgressView ()
{
    CAShapeLayer *_shapeLayer;
}
@end
@implementation CircleProgressView
@synthesize fstartValue=_fstartValue;
@synthesize flineWidth=_flineWidth;
@synthesize lineColor=_lineColor;
@synthesize fvalue=_fvalue;


- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self)
    {
        /**创建带形状的图层*/
        _shapeLayer=[CAShapeLayer layer];
        _shapeLayer.frame     = self.bounds;
        _shapeLayer.strokeEnd = 0.f;
        
        /*创建布赛尔曲线*/
        UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:self.bounds];
        
        /**把图层和不塞尔曲线通过path进行关联*/
        _shapeLayer.path   = path.CGPath;
        
        /**设置图层的填充颜色、宽度、边框颜色*/
        _shapeLayer.fillColor   = [UIColor clearColor].CGColor;
        _shapeLayer.lineWidth   = 1.0f;
        _shapeLayer.strokeColor = [UIColor redColor].CGColor;
        
        [self.layer addSublayer:_shapeLayer];
    }
    return self;
}
/**
 *  @brief  重写fstartValue的setter方法
 *  @param fstartValue  设置圆形strokeStart起始值
 *  @since
 */
- (void)setFstartValue:(CGFloat)fstartValue
{
    _fstartValue          = fstartValue;
    _shapeLayer.strokeStart = fstartValue;
    
}
- (CGFloat)fstartValue
{
    return _fstartValue;
}
/**
 *  @brief  重写flineWidth的setter方法
 *  @param flineWidth  设置圆形边框宽度
 *  @since
 */

- (void)setFlineWidth:(CGFloat)flineWidth
{
    _flineWidth           = flineWidth;
    _shapeLayer.lineWidth = flineWidth;
}
/**
 *  @brief  重写lineColor的setter方法
 *  @param lineColor  设置圆形边框颜色
 *  @since
 */

- (void)setLineColor:(UIColor *)lineColor
{
    _lineColor              = lineColor;
    _shapeLayer.strokeColor = lineColor.CGColor;
}
- (UIColor *)lineColor
{
    return _lineColor;
}
/**
 *  @brief  重写fvalue的setter方法
 *  @param lineColor  设置圆形的strokeEnd值
 *  @since
 */
- (void)setFvalue:(CGFloat)fvalue
{
    _fvalue                = fvalue;
    _shapeLayer.strokeEnd = fvalue;
}

- (CGFloat)fvalue
{
    return _fvalue;
}
@end
#import "ViewController.h"
#import "CircleProgressView.h"
@interface ViewController ()
{
    CircleProgressView *progress;
}
@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    progress             = [[CircleProgressView alloc]initWithFrame:CGRectMake(0, 0, 200, 200)];
    progress.center      = self.view.center;
    progress.lineColor   = [UIColor redColor];
    progress.flineWidth  = 1.0f;
    progress.fstartValue = 0;
    [self.view addSubview:progress];
    [NSTimer scheduledTimerWithTimeInterval:1.0f target:self selector:@selector(circleAnimation) userInfo:nil repeats:YES];
    
}
- (void)circleAnimation
{
    progress.fvalue = arc4random()%100/100.f;
}
- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
   
}

@end

技术分享

通过布赛尔曲线以及CAShapeLayer的strokeStart 、strokeEnd 属性来实现一个圆形进度条

标签:

原文地址:http://www.cnblogs.com/thbbsky/p/4383978.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!