之前對mask屬性了解的特別少晚吞,今天特意來看看其用法:
*********mask就是PS中的遮罩;
*********遮罩層必須至少有兩個圖層刽宪,上面的一個圖層為“遮罩層”摆昧,下面的稱“被*********遮罩層”顿苇;這兩個圖層中只有相重疊的地方才會被顯示。也就是說在遮*********罩層中有對象的地方就是“透明”的税弃,可以看到被遮罩層中的對象纪岁,而沒*********有對象的地方就是不透明的,被遮罩層中相應位置的對象是看不見的则果。
1.可以實現(xiàn)UILabel 字體的漸變效果
1.1先設置一個漸變的CAGradientLayer圖層
1.2給漸變圖層添加一個遮蓋(UIlabel)使其frame跟圖層完全一樣
1.3把label 設置成漸變圖層的mask(遮蓋)
let gradientLayer = CAGradientLayer()
gradientLayer.frame = CGRect(x: 100, y: 200, width: 100, height: 30)
gradientLayer.colors = [UIColor.green.cgColor,UIColor.blue.cgColor,UIColor.brown.cgColor,UIColor.red.cgColor]
gradientLayer.locations = [NSNumber(value: 0.1),NSNumber(value: 0.3),NSNumber(value: 0.5),NSNumber(value: 0.8)]
gradientLayer.startPoint = CGPoint(x: 0, y: 0.5)
gradientLayer.endPoint = CGPoint(x: 1, y: 0.5)
self.view.layer.addSublayer(gradientLayer)
let testLabel = UILabel()
testLabel.frame = gradientLayer.bounds
testLabel.textColor = UIColor.black
testLabel.font = UIFont.systemFont(ofSize: 14)
testLabel.backgroundColor = UIColor.clear
testLabel.textAlignment = .center
testLabel.text = "我只是測試"
self.view.addSubview(testLabel)
gradientLayer.mask = testLabel.layer
實現(xiàn)效果:
2.可以實現(xiàn)漸變的進度條
2.1先創(chuàng)建一個進度條背景圖層
2.2創(chuàng)建一個漸變圖層
2.3創(chuàng)建一個圖層用于遮蓋(漸變層的mask為當前圖層)
2.4點擊按鈕修改遮蓋的frame (此時的遮蓋不要設置為clear,因為上面需要有對象才行)
//先創(chuàng)建一個進度條背景圖層
let bgLayer = CALayer()
bgLayer.frame = CGRect(x: 100, y: 200, width: 200, height: 20)
bgLayer.backgroundColor = UIColor.gray.cgColor
bgLayer.masksToBounds = true
bgLayer.cornerRadius = 10
self.view.layer.addSublayer(belayer)
//創(chuàng)建一個漸變圖層
gradientLayer = CAGradientLayer()
gradientLayer.frame = bgLayer.frame
gradientLayer.masksToBounds = true
gradientLayer.cornerRadius = 10
gradientLayer.colors = [UIColor.green.cgColor,UIColor.blue.cgColor,UIColor.brown.cgColor,UIColor.red.cgColor]
gradientLayer.locations = [NSNumber(value: 0.1),NSNumber(value: 0.3),NSNumber(value: 0.5),NSNumber(value: 0.8)]
gradientLayer.startPoint = CGPoint(x: 0, y: 0.5)
gradientLayer.endPoint = CGPoint(x: 1, y: 0.5)
self.view.layer.addSublayer(gradientLayer)
//創(chuàng)建一個圖層用于遮蓋(漸變層的mask為當前圖層)
maskLayer = CALayer()
maskLayer.frame = CGRect(x: 0, y: 0, width: 60, height: 20)
maskLayer.backgroundColor = UIColor.black.cgColor
gradientLayer.mask = maskLayer
//點擊按鈕修改遮蓋的frame (此時的遮蓋不要設置為clear,因為上面需要有對象才行)此時我們可以添加動畫來展示效果
CATransaction.begin()
CATransaction.setDisableActions(false)
CATransaction.setAnimationTimingFunction(CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut))
CATransaction.setAnimationDuration(0.4)
maskLayer.frame.size.width = 180
CATransaction.commit()