Core Animation - 渐变色CAGradientLayer

简介: Core Animation - 渐变色CAGradientLayer

由一个颜色过渡到另一个颜色,甚至直接作出彩虹的效果,这便是CAGradientLayer的作用,CAGradientLayer有startPoint和endPoint两个属性,分别是{0,0}和{1,1}:

 //create gradient layer and add it to our container view
    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.frame = self.containerView.bounds;
    [self.containerView.layer addSublayer:gradientLayer];
//set gradient colors
gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor, (__bridge id)[UIColor blueColor].CGColor];
    //set gradient start and end points
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(1, 1);

除了渐变还有多重渐变这个概念,就是我上面说的彩虹色,当然,只要你愿意,彩虹色也是可以写出来的,设置locations这个属性:

    gradientLayer.locations = @[@0.0, @0.25, @0.5];

来给颜色进行分段,但是博主用了这个感觉并不好用,所以博主试着在gradientLayer.colors这个颜色数组中分别加入了彩虹的每一个颜色:

    //彩虹色
    gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor, (__bridge id)[UIColor orangeColor].CGColor, (__bridge id)[UIColor yellowColor].CGColor, (__bridge id)[UIColor greenColor].CGColor, (__bridge id)[UIColor cyanColor].CGColor, (__bridge id)[UIColor blueColor].CGColor, (__bridge id)[UIColor purpleColor].CGColor];

然后炫酷的彩虹色就出来了,github地址:https://github.com/codeliu6572/CAGradientLayer

目录
相关文章
Core Animation - 图层行为
Core Animation - 图层行为
91 0
Core Animation - 图层行为
|
iOS开发
Core Animation - 图层几何学<一>
Core Animation - 图层几何学<一>
102 0
Core Animation - 图层几何学<一>
Core Animation - 如何来绘制一个火柴人
Core Animation - 如何来绘制一个火柴人
137 0
Core Animation - 如何来绘制一个火柴人
|
图形学
Core Animation -关键帧动画
Core Animation -关键帧动画
116 0
Core Animation - 视觉效果<二>
Core Animation - 视觉效果<二>
58 0
|
iOS开发
Core Animation - 视觉效果<一>
Core Animation - 视觉效果<一>
99 0
|
算法 iOS开发
Core Animation - 视觉效果<三>
Core Animation - 视觉效果<三>
75 0
|
iOS开发 MacOS
Core Animation - 图层几何学<二>
Core Animation - 图层几何学<二>
97 0
|
图形学
Core Animation - CATextLayer和富文本
Core Animation - CATextLayer和富文本
124 0
Core Animation - CATransformLayer的运用
Core Animation - CATransformLayer的运用
73 0