原地址:學習做筆記使用
CAGradientLayer能夠提供漸變色(官方叫:梯度色)可實現遮罩功能
在介紹漸變色之前我們首先了解Layer的坐標系
Layer坐標系.png
根據上圖的坐標檀咙,設定好起點和終點站楚,漸變色的方向就會根據起點指向終點的方向來漸變了蜂嗽。呆會代碼里會有寫。
1,CAGradientLayer的坐標系統(tǒng)是從(0播歼,0)到(1,1)繪制的矩形
2掰读,CAGradientLayer的frame值的size不為正方形的話秘狞,坐標系統(tǒng)會被拉伸
3,CAGradientLayer的startPoint和endPoint會直接決定顏色的繪制方向
4蹈集,CAGradientLayer的顏色分割點時以0到1的比例來計算的
CAGradientLayer只提供了5個屬性:
@interface CAGradientLayer : CALayer
@property(nullable, copy) NSArray *colors;
@property(nullable, copy) NSArray<NSNumber *> *locations;
@property CGPoint startPoint;
@property CGPoint endPoint;
@property(copy) NSString *type;
@end
代碼示例:
CAGradientLayer *gradientLayer = [CAGradientLayer layer];
self.gradientLayer = gradientLayer;
[self.view.layer addSublayer:gradientLayer];
gradientLayer.bounds = CGRectMake(0, 0, 200, 200);
gradientLayer.position = self.view.center;
// 顏色分配
gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,
(__bridge id)[UIColor greenColor].CGColor,
(__bridge id)[UIColor blueColor].CGColor];
// 顏色分割線
//而locations并不是表示顏色值所在位置,它表示的是顏色在Layer坐標系相對位置處要開始進行漸變顏色了.
gradientLayer.locations = @[@(0.25), @(0.5), @(0.75)];
// 起始點
gradientLayer.startPoint = CGPointMake(0, 0);
// 結束點
gradientLayer.endPoint = CGPointMake(1, 0);
運行效果: