CAGradientLayer渐变颜色动画

CAGradientLayer渐变颜色动画

或许你用过CAGradientLayer,你知道他是用于渐变颜色的,但你是否直到,CAGradientLayer的渐变颜色是可以动画的哦.

源码:

//

//  RootViewController.m

//  CAGradientLayer

//

//  Copyright (c) 2014年 Y.X. All rights reserved.

//

#import "RootViewController.h"

#import "CAShapeLayer+Circle.h"

#import "YXGCD.h"

@interface RootViewController ()

@property (nonatomic, strong) GCDTimer  *timer;

@end

@implementation RootViewController

- (void)viewDidLoad

{

    [super viewDidLoad];

    self.view.backgroundColor = [UIColor blackColor];

    // 创建形状遮罩

    CAShapeLayer *circleLayer = [CAShapeLayer LayerWithCircleCenter:CGPointMake(, )

                                                             radius:

                                                         startAngle:DEGREES()

                                                           endAngle:DEGREES()

                                                          clockwise:YES

                                                    lineDashPattern:@[@, @]];

    circleLayer.strokeColor   = [UIColor blackColor].CGColor;   // 边缘线的颜色

    circleLayer.lineCap       = kCALineCapSquare;               // 边缘线的类型

    circleLayer.lineWidth     = 1.0f;                           // 线条宽度

    circleLayer.strokeStart   = 0.0f;

    circleLayer.strokeEnd     = 1.0f;

    // 创建渐变图层

    CAGradientLayer *faucet = [CAGradientLayer layer];

    faucet.frame            = CGRectMake(, , , );

    faucet.position         = self.view.center;

    // 以CAShapeLayer的形状作为遮罩是实现特定颜色渐变的关键

    faucet.mask   = circleLayer;

    faucet.colors = @[(id)[UIColor greenColor].CGColor,

                      (id)[UIColor redColor].CGColor,

                      (id)[UIColor cyanColor].CGColor];

    // 设定动画时间

    faucet.speed = 0.5f;

    // 添加到系统图层中

    [self.view.layer addSublayer:faucet];

    // 定时器动画事件

    _timer = [[GCDTimer alloc] initInQueue:[GCDQueue mainQueue]];

    [_timer event:^{

        circleLayer.strokeEnd = arc4random() %  / .f;

        faucet.colors = @[(id)[UIColor colorWithRed:arc4random()%/.f

                                              green:arc4random()%/.f

                                               blue:arc4random()%/.f

                                              alpha:].CGColor,

                          (id)[UIColor colorWithRed:arc4random()%/.f

                                              green:arc4random()%/.f

                                               blue:arc4random()%/.f

                                              alpha:].CGColor,

                          (id)[UIColor colorWithRed:arc4random()%/.f

                                              green:arc4random()%/.f

                                               blue:arc4random()%/.f

                                              alpha:].CGColor,

                          (id)[UIColor colorWithRed:arc4random()%/.f

                                              green:arc4random()%/.f

                                               blue:arc4random()%/.f

                                              alpha:].CGColor,

                          (id)[UIColor colorWithRed:arc4random()%/.f

                                              green:arc4random()%/.f

                                               blue:arc4random()%/.f

                                              alpha:].CGColor];

    } timeInterval:NSEC_PER_SEC];

    [_timer start];

}

@end

效果如下:

以下代码才是核心的地方:

附录:

http://stackoverflow.com/questions/21121670/cagradientlayer-with-cashapelayer-mask-not-showing