Swift CAGradientLayer颜色渐变器

我们想设置一个view的颜色，通常可以用backgroundColor方法，但是这只能设置纯色背景。如果想实现渐变色背景，一种方法是使用Core Graphics，还有一种方法就是本文要提的CAGradientLayer。
CAGradientLayer是用来生成两种或者多种颜色平滑渐变的，其好处是CAGradientLayer在于绘制使用了硬件加速。

1、属性基本介绍：

//颜色数组，定义渐变层的各个颜色
open var colors: [Any]?
//决定每个渐变颜色的终止位置，这些值必须是递增的，数组的长度和 colors 的长度最好一致
open var locations: [NSNumber]?
//渲染的起始位置，默认值是：[.5,0]（具体坐标系参考下图）
open var startPoint: CGPoint
//渲染的终止位置，默认值是：[.5,1]（具体坐标系参考下图）
open var endPoint: CGPoint
//默认值是axial，表示按像素均匀变化。除了默认值也无其它选项
open var type: String

坐标系参考.png

2、渐变色背景

let gradientLayer = CAGradientLayer()
gradientLayer.frame = self.view.bounds
self.view.layer.addSublayer(gradientLayer)
gradientLayer.colors = [UIColor.red.cgColor,
                                UIColor.yellow.cgColor,
                                UIColor.orange.cgColor]
let gradientLocations:[NSNumber] = [0.0,0.8,1.0]
gradientLayer.locations = gradientLocations
gradientLayer.startPoint = CGPoint.init(x: 0, y: 0)
gradientLayer.endPoint = CGPoint.init(x: 1, y: 1)

效果图如下：

渐变色背景.png

3、文字添加渐变色

//首先分别创建渐变层和文本标签，然后将渐变层的mask设置为文本标签即可。
let containerView = UIView.init(frame: CGRect.init(x: 20, y: 100, width: 200, height: 60))
self.view.addSubview(containerView)
        
let label = UILabel.init(frame: CGRect.init(x: 0, y: 0, width: 200, height: 60))
label.text = "Darren wang"
label.font = UIFont.boldSystemFont(ofSize: 26)
containerView.addSubview(label)
        
let gradientLayer = CAGradientLayer()
gradientLayer.colors = [UIColor.orange.cgColor, UIColor.yellow.cgColor]
gradientLayer.locations = [0.0, 1.0]
gradientLayer.frame = label.frame
containerView.layer.insertSublayer(gradientLayer, at: 0)
gradientLayer.mask = label.layer

效果图如下：

文字渐变色.png

4、边界渐隐效果

//原理同文字渐变色，但是使用的是透明度渐变。依然为容器view设置遮罩，主要代码如下
let containerView = UIView.init(frame: CGRect.init(x: 0, y: 150, width: view.frame.size.width, height: view.frame.size.height-150))
view.addSubview(containerView)
        
let tableView = UITableView()
tableView.frame = containerView.bounds
tableView.backgroundColor = .clear
tableView.separatorStyle = .none
tableView.rowHeight = 30
tableView.register(TableViewCell.self, forCellReuseIdentifier: "cell")
tableView.dataSource = self
containerView.addSubview(tableView)
        
let gradientLayer = CAGradientLayer()
gradientLayer.colors = [UIColor.black.withAlphaComponent(0.0).cgColor,
        UIColor.black.cgColor]
gradientLayer.frame = containerView.frame
gradientLayer.locations = [0,0.15,1]
containerView.layer.mask = gradientLayer

效果图如下：

边界渐隐效果.png

以上代码扔到了github:https://github.com/darren1192/WHSwiftDemo