自动旋转渐变圆环


//.h文件
#import <UIKit/UIKit.h>

@interface CirlceView : UIView

/**线宽**/
- (instancetype)initWithFrame:(CGRect)frame lineWidth:(CGFloat)lineWidth;
/**改变圆环颜色**/
- (void)changeColor:(UIColor *)color Step:(NSInteger)step;
/**添加动画**/
- (void)addRatateAnimation;
/**改变旋转速度 0~1**/
- (void)changeSpeed:(CGFloat)value;

@end


//.m文件

#import "CirlceView.h"

@interface CirlceView ()

{
    CAShapeLayer *_trackLayer;
    CALayer *_gradientLayer;
    CAGradientLayer *_gradientLayer1;
    CAGradientLayer *_gradientLayer2;
    CAGradientLayer *_gradientLayer3;
    CAGradientLayer *_gradientLayer4;
    CAShapeLayer *_progressLayer;
    CABasicAnimation *_animation;
    CGFloat _lineWidth;
    UIColor *cor1;
    UIColor *cor2;
    UIColor *cor3;
    UIColor *cor4;
}

@end

@implementation CirlceView

- (instancetype)initWithFrame:(CGRect)frame lineWidth:(CGFloat)lineWidth
{
    self = [super initWithFrame:frame];
    if (self) {

        [self setDefault];
        _lineWidth = lineWidth;

        [self drawRing];
    }
    return self;
}

- (void)setDefault{
    _lineWidth = 30;
    cor1 = [UIColor redColor];
    cor2 = [UIColor yellowColor];
    cor3 = [UIColor greenColor];
    cor4 = [UIColor blueColor];
}

- (void)drawRing{

    CGFloat w = self.frame.size.width/2.0;
    CGFloat h = self.frame.size.height/2.0;

    CGFloat scale = _lineWidth/w;

    _trackLayer = [CAShapeLayer layer];
    _trackLayer.frame = self.bounds;
    _trackLayer.fillColor = [UIColor clearColor].CGColor;
    _trackLayer.strokeColor = [UIColor redColor].CGColor;
    _trackLayer.lineWidth = _lineWidth;

    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.frame.size.width/2.0, self.frame.size.height/2.0) radius:w-_lineWidth/2.0 startAngle:-M_PI_2 endAngle:-M_PI_2+M_PI*2 clockwise:YES];
    _trackLayer.path = path.CGPath;
    [self.layer addSublayer:_trackLayer];

    _gradientLayer = [CALayer layer];
    _gradientLayer.frame = self.bounds;

    _gradientLayer1 = [CAGradientLayer layer];
    _gradientLayer1.frame = CGRectMake(0.0, 0.0, w, h);
    _gradientLayer1.colors = @[(__bridge id)cor1.CGColor,(__bridge id)cor2.CGColor];
    _gradientLayer1.startPoint = CGPointMake(scale, 1);
    _gradientLayer1.endPoint = CGPointMake(1, scale);
    [_gradientLayer addSublayer:_gradientLayer1];

    _gradientLayer2 = [CAGradientLayer layer];
    _gradientLayer2.frame = CGRectMake(w, 0, w, h);
    _gradientLayer2.colors = @[(__bridge id)cor2.CGColor,(__bridge id)cor3.CGColor];
    _gradientLayer2.startPoint = CGPointMake(0, scale);
    _gradientLayer2.endPoint = CGPointMake(1-scale, 1);
    [_gradientLayer addSublayer:_gradientLayer2];

    _gradientLayer3 = [CAGradientLayer layer];
    _gradientLayer3.frame = CGRectMake(w, h, w, h);
    _gradientLayer3.colors = @[(__bridge id)cor3.CGColor,(__bridge id)cor4.CGColor];
    _gradientLayer3.startPoint = CGPointMake(1-scale, 0);
    _gradientLayer3.endPoint = CGPointMake(0, 1-scale);
    [_gradientLayer addSublayer:_gradientLayer3];

    _gradientLayer4 = [CAGradientLayer layer];
    _gradientLayer4.frame = CGRectMake(0, h, w, h);
    _gradientLayer4.colors = @[(__bridge id)cor4.CGColor,(__bridge id)cor1.CGColor];
    _gradientLayer4.startPoint = CGPointMake(1, 1-scale);
    _gradientLayer4.endPoint = CGPointMake(scale, 0);
    [_gradientLayer addSublayer:_gradientLayer4];

    [self.layer addSublayer:_gradientLayer];

    _progressLayer = [CAShapeLayer layer];
    _progressLayer.frame = self.bounds;
    _progressLayer.fillColor = [UIColor clearColor].CGColor;
    _progressLayer.lineWidth = _lineWidth;
    _progressLayer.strokeColor = [UIColor colorWithRed:170/255 green:210/255 blue:254/255 alpha:1].CGColor;

    _progressLayer.path = path.CGPath;
    _gradientLayer.mask = _progressLayer;
}

- (void)changeColor:(UIColor *)color Step:(NSInteger)step{
    switch (step) {
        case 0:
            cor1 = color;
            break;
        case 1:
            cor2 = color;
            break;
        case 2:
            cor3 = color;
            break;
        default:
            cor4 = color;
            break;
    }
    [self changeColor];
}

- (void)changeColor{
    _gradientLayer1.colors = @[(__bridge id)cor1.CGColor,(__bridge id)cor2.CGColor];
    _gradientLayer2.colors = @[(__bridge id)cor2.CGColor,(__bridge id)cor3.CGColor];
    _gradientLayer3.colors = @[(__bridge id)cor3.CGColor,(__bridge id)cor4.CGColor];
    _gradientLayer4.colors = @[(__bridge id)cor4.CGColor,(__bridge id)cor1.CGColor];
}

- (void)addRatateAnimation{

    _animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    _animation.fromValue = [NSNumber numberWithFloat:0.0f];
    _animation.toValue = [NSNumber numberWithFloat:2*M_PI];
    _animation.duration = 2;
    _animation.autoreverses = NO;
    _animation.fillMode = kCAFillModeForwards;
    _animation.repeatCount = 1000;
    [self.layer addAnimation:_animation forKey:nil];
}

- (void)changeSpeed:(CGFloat)value{
    _animation.duration = value*3;
    [self.layer addAnimation:_animation forKey:nil];
}

@end

//示例
#import "ViewController.h"
#import "GYCirlceView.h"

@interface ViewController ()

@property (nonatomic,strong)GYCirlceView *cview;

@property (weak, nonatomic) IBOutlet UISlider *slider;


@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    self.cview = [[GYCirlceView alloc]initWithFrame:CGRectMake(10.0, 110, 355, 355) lineWidth:35];
    [self.cview addRatateAnimation];
    [self.view addSubview:self.cview];
    self.slider.value = self.cview.currentValue;
}

- (IBAction)slider:(UISlider *)sender {
    [self.cview changeSpeed:sender.value];
}

- (IBAction)b1:(UIButton *)sender {
    [self.cview changeColor:sender.backgroundColor Step:0];
}

- (IBAction)b2:(UIButton *)sender {
    [self.cview changeColor:sender.backgroundColor Step:1];
}
- (IBAction)b3:(UIButton *)sender {
    [self.cview changeColor:sender.backgroundColor Step:2];
}

- (IBAction)b4:(UIButton *)sender {
    [self.cview changeColor:sender.backgroundColor Step:3];
}



... prompt'''

//截图
这里写图片描述

这里写图片描述
这里写图片描述

参考:http://www.jianshu.com/p/64ca14e560d9

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值