创建一个渐变遮罩~

很多应用中为了美观和让视图过渡的时候显得尽量平滑,使用了渐变的效果.八国如果美工没时间给作图的话,我们可以自己去实现

使用渐变CAGradientLayer

  CAGradientLayer *topLayer = [[CAGradientLayer alloc] init];
    topLayer.frame = CGRectMake(0, 0, 320, 100);
    topLayer.colors = @[(id)[UIColor colorWithWhite:1.0 alpha:0.0].CGColor,(id)self.view.backgroundColor.CGColor];
    topLayer.startPoint = CGPointMake(0.0, 1);
    topLayer.endPoint = CGPointMake(0.0f, 0.0f);
    
    
    [self.view.layer addSublayer:topLayer];

用上面的代码就欧克了

 

至于为什么要用CGColor然后再转为id,因为CAGradientLayer说明里面是这么写的

/* The array of CGColorRef objects defining the color of each gradient
 * stop. Defaults to nil. Animatable. */

@property(copy) NSArray *colors;

 

还有startPoint和endPoint不是实际的坐标点,而是类似于锚点anchorPoint的一种点[范围是0-1],头文件里是这么写的

/* The start and end points of the gradient when drawn into the layer's
 * coordinate space. The start point corresponds to the first gradient
 * stop, the end point to the last gradient stop. Both points are
 * defined in a unit coordinate space that is then mapped to the
 * layer's bounds rectangle when drawn. (I.e. [0,0] is the bottom-left
 * corner of the layer, [1,1] is the top-right corner.) The default values
 * are [.5,0] and [.5,1] respectively. Both are animatable. */

@property CGPoint startPoint, endPoint;

point第一个元素代表左右方向,第二个元素代表上下方向.

 

此外CAGradientLayer还有一个属性是可以实现更高级的渐变效果,可以控制各个颜色区域所占的比例等,有兴趣的可以设置一下看看效果~

/* An optional array of NSNumber objects defining the location of each
 * gradient stop as a value in the range [0,1]. The values must be
 * monotonically increasing. If a nil array is given, the stops are
 * assumed to spread uniformly across the [0,1] range. When rendered,
 * the colors are mapped to the output colorspace before being
 * interpolated. Defaults to nil. Animatable. */

@property(copy) NSArray *locations;