iOS 颜色渐变 - CAGradientLayer

原文ios实现颜色渐变的几种方法 - 简书 , 还有其他几种,但是我只用了第一个.   

1. CAGradientLayer实现渐变

CAGradientLayer是CALayer的一个特殊子类，用于生成颜色渐变的图层，使用较为方便，下面介绍下它的相关属性：

1. colors 渐变的颜色
2. locations 渐变颜色的分割点
3. startPoint&endPoint 颜色渐变的方向，范围在(0,0)与(1.0,1.0)之间，如(0,0)(1.0,0)代表水平方向渐变,(0,0)(0,1.0)代表竖直方向渐变

    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor, (__bridge id)[UIColor yellowColor].CGColor, (__bridge id)[UIColor blueColor].CGColor];
    gradientLayer.locations = @[@0.3, @0.5, @1.0];
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(1.0, 0);
    gradientLayer.frame = CGRectMake(0, 100, 300, 100);
    [self.view.layer addSublayer:gradientLayer];

           CAGradientLayer实现渐变标间简单直观，但存在一定的局限性，比如无法自定义整个渐变区域的形状，如环形、曲线形的渐变。

我使用的  , 挺好用的 , 结合mask属性可以做一些有趣的效果ios UIView的mask属性,view和layer的关系_gcs的博客-CSDN博客

---

文字颜色渐变, 比如这样

    UILabel *bottomLable = [[UILabel alloc] initWithFrame:CGRectMake(0, 650, 200, 100)];
    bottomLable.text = @"免费领取";
    bottomLable.textAlignment = NSTextAlignmentCenter;
    bottomLable.font = [UIFont systemFontOfSize:40];
    [self.view addSubview:bottomLable];

    // 创建渐变层
    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,
                             (__bridge id)[UIColor yellowColor].CGColor,
                             (__bridge id)[UIColor blackColor].CGColor];
    gradientLayer.locations = @[@0.3, @0.5, @1.0];
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(1.0, 1.0);
    // 渐变层的位置在label的位置
    gradientLayer.frame = bottomLable.frame;

    // mask层工作原理:按照透明度裁剪，只保留非透明部分，文字就是非透明的，因此除了文字，其他都被裁剪掉，这样就只会显示文字下面渐变层的内容，相当于留了文字的区域，让渐变层去填充文字的颜色。
    // 设置渐变层的裁剪层
    gradientLayer.mask = bottomLable.layer;
    [self.view.layer addSublayer:gradientLayer];

    // 注意:一旦把label层设置为mask层，label层就不能显示了,会直接从父层中移除，然后作为渐变层的mask层，且label层的父层会指向渐变层
    // 父层改了，坐标系也就改了，需要重新设置label的位置，才能正确的设置裁剪区域。
    bottomLable.frame = gradientLayer.bounds;

---

// 我用这个颜色渐变做了一个下载进度的展示 , 

//  文档名字Label的背景色渐变, 用渐变的来表示下载的进度 . 发现有时背景会盖住Label.text , 有时不会 .开始百度解决问题.最后发现....

// 如果文档是英文名 ,那么下载进度会盖住文档标题,所以CAGradientLayer不能加载label上 ,只能在加一层view

// UILabel 在加载中文的时候layer.sublayers会多一个叫 _UILabelContentLayer , 用来渲染中文 , gradientLayer在 _UILabelContentLayer之前,不会盖住字,完美

// 但是如果是英文的文档名的话 ,没有 _UILabelContentLayer ,字会被gradientLayer盖住 ,显示不出来

// 解释了中英文渲染的不同 uikit - When I used Chinese UITableview cell will be color blended - Stack Overflow

// 解决方案 ios - UILabel add GradientLayer - Stack Overflow