给View添加渐变颜色

两种方法给View添加渐变颜色

一.CAGradientLayer添加渐变颜色

该方法我是写在了UIView的一个分类当中,所以self就是指的view,

Direction为自定义枚举,用来判断是横向渐变还是竖向渐变。

任何继承UIView的子类都可以直接调用。

/*

 *colors:渐变颜色数组

 *locations:变化位置 0 -- 1,和颜色数组元素个数对应

 *direction:方向 横  竖

 */

- (void)setCAGradientLayerGradualColorWithColors:(NSArray<UIColor *> *)colors locations:(NSArray<NSNumber *> *)locations direction:(Direction)direction{

    CAGradientLayer * gradientLayer = [CAGradientLayer layer];

    NSMutableArray * colorsM = @[].mutableCopy;

    for (int i = 0; i < colors.count; i ++) {

        UIColor * color = colors[i];

        [colorsM addObject:(__bridge id)color.CGColor];

    }

    gradientLayer.colors = colorsM;

    gradientLayer.locations = locations;

    gradientLayer.startPoint = CGPointMake(0, 0);

    gradientLayer.endPoint = CGPointMake(0, 1.0);

    if (direction == DirectionHorizontal) {

        gradientLayer.endPoint = CGPointMake(1.0, 0);

    }

    gradientLayer.frame = CGRectMake(0, 0, self.frame.size.width, self.frame.size.height);

    [self.layer addSublayer:gradientLayer];

}

二. Core Graphics相关方法添加渐变颜色

/*

 *colors:渐变颜色数组

 *locations:变化位置 0 -- 1,和颜色数组元素个数对应

 *direction:方向 横  竖

 */

- (void)setGraphicsColorWithColors:(NSArray<UIColor *>*)colors locations:(NSArray<NSNumber *> *)locations direction:(Direction)direction{

    //创建CGContextRef

    UIGraphicsBeginImageContext(self.bounds.size);

    CGContextRef gc = UIGraphicsGetCurrentContext();

    //创建CGMutablePathRef

    CGMutablePathRef path = CGPathCreateMutable();

    //绘制path

    CGRect rect = CGRectMake(0, 0, self.frame.size.width, self.frame.size.height);

    CGPathMoveToPoint(path, NULL, CGRectGetMinX(rect), CGRectGetMinY(rect));

    CGPathAddLineToPoint(path, NULL, CGRectGetMaxX(rect), CGRectGetMinY(rect));

    CGPathAddLineToPoint(path, NULL, CGRectGetMaxX(rect), CGRectGetMaxY(rect));

    CGPathAddLineToPoint(path, NULL, CGRectGetMinX(rect), CGRectGetMaxY(rect));

    CGPathCloseSubpath(path);

    //绘制渐变

    [self drawLinearGradient:gc path:path colors:colors locations:locations direction:direction];

    //注意释放CGMutablePathRef

    CGPathRelease(path);

    //从Context中获取图像,并显示在界面上

    UIImage * img = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();

    

    UIImageView * imageView = [[UIImageView alloc] initWithImage:img];

    [self addSubview:imageView];

}

//线性

- (void)drawLinearGradient:(CGContextRef)context path:(CGPathRef)path colors:(NSArray<UIColor *> *)colors locations:(NSArray<NSNumber *> *)locations direction:(Direction)direction{

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();

    CGFloat floatLocations[locations.count];

    for (int i = 0; i < locations.count; i ++) {

        floatLocations[i] = [locations[i] floatValue];

    }

    NSMutableArray * colorsM = @[].mutableCopy;

    for (int i = 0; i < colors.count; i ++) {

        UIColor * color = colors[i];

        [colorsM addObject:(__bridge id)color.CGColor];

    }

    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)colorsM, floatLocations);

    CGRect pathRect = CGPathGetBoundingBox(path);

    //具体方向可根据需求修改

    CGPoint startPoint = CGPointMake(CGRectGetMinX(pathRect), CGRectGetMidY(pathRect));

    CGPoint endPoint = CGPointMake(CGRectGetMaxX(pathRect), CGRectGetMidY(pathRect));

    if (direction == DirectionVertical) {

        startPoint = CGPointMake(CGRectGetMinX(pathRect), CGRectGetMinY(pathRect));

        endPoint = CGPointMake(CGRectGetMinX(pathRect), CGRectGetMaxY(pathRect));

    }

    

    CGContextSaveGState(context);

    CGContextAddPath(context, path);

    CGContextClip(context);

    CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);

    CGContextRestoreGState(context);

    CGGradientRelease(gradient);

    CGColorSpaceRelease(colorSpace);

}

Demo中还有一个圆形半径方向的渐变效果可以下载下来进行查看。

猜你喜欢

转载自blog.csdn.net/weixin_39339407/article/details/80985254