CAGradientLayer

CAGradientLayer是CALayer的子类,通常我们用它最多的地方是用来做渐变色,下面我们来看一下它的属性

colors:渐变颜色的集合,这是一个数组,里面装的是渐变色的颜色,而且颜色不是UIColor而是CGColor,所以我们还需要进行类型转换

locations:这是定义渐变色的颜色位置的区间范围,其值在0到1之间,并且这里面的数组个数必须和colors里面的颜色数组个数一样,另外这个数组里面的数值必须是递增的,不然渐变色的分割线特比明显,几种颜色看起来没有过渡

startPoint:渐变色开始的地方,这里的默认值是(0.5,0)

endPoint:渐变色结束的地方,这里的默认值是(0.5,1)

具体的使用代码:

    _gradientLayer = [CAGradientLayer layer];
    _gradientLayer.frame = self.view.bounds;
//这里必须是CGColor不然没有颜色,且要在前面加入__bridge id进行类型转换
    _gradientLayer.colors = [NSArray arrayWithObjects:(__bridge id)[UIColor purpleColor].CGColor,(
![Uploading Simulator Screen Shot 2017年5月9日 11.40.44_268950.png . . .]__bridge id)[UIColor redColor].CGColor, nil];
    _gradientLayer.locations = [NSArray arrayWithObjects:[NSNumber numberWithFloat:0.65],[NSNumber numberWithFloat:1], nil];
    _gradientLayer.startPoint = CGPointMake(0.0, 0);
    _gradientLayer.endPoint = CGPointMake(0.0, 1);
    [self.view.layer addSublayer:_gradientLayer];

效果:

Simulator Screen Shot 2017年5月9日 11.40.44.png

这里开始位置是(0,0),结束位置是(0,1),即开始到结束的位置是竖直的,那么颜色的放置的位置就是水平的。

如果我们把开始和结束的位置换一下看看效果:

Simulator Screen Shot 2017年5月9日 11.46.46.png

再换一下,换成对角线的看看:

Simulator Screen Shot 2017年5月9日 11.48.31.png

这样我们会发现一个规律,颜色放置的线和开始结束形成的线是垂直的,既成90度

然后我们来看一下location数组如果不是递增的会发生什么情况:
我们把location的代码改成下面这样子:

_gradientLayer.locations = [NSArray arrayWithObjects:[NSNumber numberWithFloat:0.65],[NSNumber numberWithFloat:0.3], nil];

这样不是递增的我们来看一下效果:

Simulator Screen Shot 2017年5月9日 13.40.41.png

这样我们看到这两种颜色之间的分界特别明显,因此location里 面的数组一定要是递增的

如果有时候我们给一个view设置一个覆盖整个view的渐变层,结果发现出来的渐变色只有一部分,此时我们可以改变一下渐变层的锚点,把它的锚点设为(0,0),因为锚点默认为(0.5,0.5)所以有时候锚点可能会影响

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容