概念

• 1，CAGradientLayer用于處理漸變色的層結(jié)構(gòu)
• 2，CAGradientLayer的漸變色可以做隱式動(dòng)畫
• 3，大部分情況下，CAGradientLayer時(shí)和CAShapeLayer配合使用的。關(guān)于CAShapeLayer可以看我的這篇博客
  基于CAShapeLayer和貝塞爾曲線的圓形進(jìn)度條動(dòng)畫【原創(chuàng)】
• 4，CAGradientLayer可以用作PNG的遮罩效果

關(guān)于CAGradientLayer的坐標(biāo)系統(tǒng)

• 為什么要提到CAGradientLayer的坐標(biāo)系統(tǒng)呢？因?yàn)闈u變色的作用范圍，變化梯度的方向，顏色變換的作用點(diǎn)都和CAGradientLayer的坐標(biāo)系統(tǒng)有關(guān)

CAGradientLayer坐標(biāo)圖

• 根據(jù)上圖的坐標(biāo)，設(shè)定好起點(diǎn)和終點(diǎn)，漸變色的方向就會(huì)根據(jù)起點(diǎn)指向終點(diǎn)的方向來漸變了。

• 1，CAGradientLayer的坐標(biāo)系統(tǒng)是從（0，0）到（1，1）繪制的矩形

• 2，CAGradientLayer的frame值的size不為正方形的話，坐標(biāo)系統(tǒng)會(huì)被拉伸

• 3，CAGradientLayer的startPoint和endPoint會(huì)直接決定顏色的繪制方向

• 4，CAGradientLayer的顏色分割點(diǎn)時(shí)以0到1的比例來計(jì)算的

下面直接上代碼，里面的注視都寫好了。就不一一解釋

• 方法1(定時(shí)器漸變)

#import "ViewController.h"
 
@interface ViewController ()
 
@property (strong, nonatomic) CAGradientLayer *gradientLayer;
@property (strong, nonatomic) NSTimer *timer;
 
@end
 
@implementation ViewController
 
- (void)viewDidLoad {
    [super viewDidLoad];
     
    //初始化imageView
    UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image"]];
    imageView.frame = CGRectMake(0, 0, self.view.bounds.size.width, 200);
    imageView.center = self.view.center;
    [self.view addSubview:imageView];
     
    //初始化漸變層
    self.gradientLayer = [CAGradientLayer layer];
    self.gradientLayer.frame = imageView.bounds;
    [imageView.layer addSublayer:self.gradientLayer];
     
    //設(shè)置漸變顏色方向
    self.gradientLayer.startPoint = CGPointMake(0, 0);
    self.gradientLayer.endPoint = CGPointMake(0, 1);
     
    //設(shè)定顏色組
    self.gradientLayer.colors = @[(__bridge id)[UIColor clearColor].CGColor,
                                  (__bridge id)[UIColor purpleColor].CGColor];
     
    //設(shè)定顏色分割點(diǎn)
    self.gradientLayer.locations = @[@(0.5f) ,@(1.0f)];
     
    //定時(shí)器
    self.timer = [NSTimer scheduledTimerWithTimeInterval:2.0f
                                                  target:self
                                                selector:@selector(TimerEvent)
                                                userInfo:nil
                                                 repeats:YES];
}
 
- (void)TimerEvent
{
    //定時(shí)改變顏色
    self.gradientLayer.colors = @[(__bridge id)[UIColor clearColor].CGColor,
                                  (__bridge id)[UIColor colorWithRed:arc4random() % 255 / 255.0
                                                               green:arc4random() % 255 / 255.0
                                                                blue:arc4random() % 255 / 255.0
                                                               alpha:1.0].CGColor];
     
    //定時(shí)改變分割點(diǎn)
    self.gradientLayer.locations = @[@(arc4random() % 10 / 10.0f), @(1.0f)];
}
 
@end

• 封裝方法(類似支付寶)

//color gradient layer  
- (void) insertColorGradient {  
      
    UIColor *colorOne = [UIColor colorWithRed:(255/255.0) green:(255/255.0) blue:(255/255.0) alpha:1.0];  
    UIColor *colorTwo = [UIColor colorWithRed:(33/255.0)  green:(33/255.0)  blue:(33/255.0)  alpha:1.0];  
      
    NSArray *colors = [NSArray arrayWithObjects:(id)colorOne.CGColor, colorTwo.CGColor, nil nil];  
    NSNumber *stopOne = [NSNumber numberWithFloat:0.0];  
    NSNumber *stopTwo = [NSNumber numberWithFloat:1.0];  
      
    NSArray *locations = [NSArray arrayWithObjects:stopOne, stopTwo, nil nil];  
    CAGradientLayer *headerLayer = [CAGradientLayer layer];  
    headerLayer.colors = colors;  
    headerLayer.locations = locations;  
    headerLayer.frame = self.bounds;  
      
    [self.layer insertSublayer:headerLayer above:0];  
      
}

• 封裝方法3

//Transparent Gradient Layer  
- (void) insertTransparentGradient {  
    UIColor *colorOne = [UIColor colorWithRed:(33/255.0)  green:(33/255.0)  blue:(33/255.0)  alpha:0.0];  
    UIColor *colorTwo = [UIColor colorWithRed:(33/255.0)  green:(33/255.0)  blue:(33/255.0)  alpha:1.0];  
// 
    NSArray *colors = [NSArray arrayWithObjects:(id)colorOne.CGColor, colorTwo.CGColor, nil nil];  
    NSNumber *stopOne = [NSNumber numberWithFloat:0.0];  
    NSNumber *stopTwo = [NSNumber numberWithFloat:1.0];  
    NSArray *locations = [NSArray arrayWithObjects:stopOne, stopTwo, nil nil];  
      
    //crate gradient layer
//初始化漸變層  
    CAGradientLayer *headerLayer = [CAGradientLayer layer];  
      
    headerLayer.colors = colors;  
    headerLayer.locations = locations;  
    headerLayer.frame = self.bounds;  
      
    [self.layer insertSublayer:headerLayer atIndex:0];  
}