php乘法表颜色渐变图片,如何生成一张渐变颜色的图片

项目的UI有一些按钮的背景颜色是渐变的，如果都让UI来切图的话，还要考虑到按的大小，各个按钮大小不一致，肯定不能切一堆的图片，这时候只能代码生成渐变颜色的图片了。

一般涉及到渐变颜色的的话，官方提供了CAGradientLayer来设置，CAGradientLayer是用来生成两种或更多颜色平滑渐变的。生成一个CAGradientLayer赋值给UIView的layer，就能达到效果。代码如下

UIView *theView = [[UIView alloc]initWithFrame:CGRectMake(100, 100, 200, 100)];

[self.view addSubview:theView];

/**创建一个CAGradientLayer 对象*/

CAGradientLayer *gradientLayer = [CAGradientLayer layer];

/**设置gradientLayer 的 Frame*/

gradientLayer.frame = theView.bounds;

/**

颜色数组，默认为nil,该数组定义了每一个渐变值得颜色。

这个数组成员接受CGColorRef类型的值,如果你愿意，colors属性可以包含很多颜色，所以创建一个彩虹一样的多重渐变也是很简单的。

默认情况下，这些颜色在空间上均匀地被渲染，但是我们可以用locations属性来调整空间。

*/

gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,

(__bridge id)[UIColor yellowColor].CGColor,

(__bridge id)[UIColor blueColor].CGColor];

/**

可选的数组，定义了每一个渐变点的位置(即定义了colors属性中每个不同颜色的位置)，范围在[0,1],数组中的值必须是渐变增加，如果数组为nil，那么将均匀渐变，当渲染的时候，颜色数组值会被映射到输出颜色空间。

*/

gradientLayer.locations = @[@(0.1f) ,@(0.4f)];

/**

startPoint和endPoint属性，它们决定了渐变的方向。

startPoint就是第一个渐变点，endPoint就是最后一个渐变点。

这两个参数是以单位坐标系进行的定义，当进行绘制内容的时候会映射到layer的矩形区域，

左上角坐标是[0,0]，右下角坐标是[1,1]。默认值是[.5,0]和[.5,1]。

*/

gradientLayer.startPoint = CGPointMake(0, 0);

gradientLayer.endPoint = CGPointMake(1, 0);

/**添加渐变色到创建的 UIView 上去*/

[theView.layer addSublayer:gradientLayer];

我觉得做到这里应该就没问题了，但是突然发现单单这样给一个UIButton设置CAGradientLayer，显示是可以，但是这样就没法处理高亮等状态了下的效果了！！！！如果设置了UIButton的layer的话，你再设置backgroundImage的话是没有效果的。既然如此，只能还是必须用图片来设置，那就寻思能否把渐变层转换成图片。经过进一步查找资料是可以的，具体试下如下：

CAGradientLayer *gradientLayer = [CAGradientLayer layer];

gradientLayer.frame = rect;

gradientLayer.startPoint = CGPointMake(0, 0);

gradientLayer.endPoint = CGPointMake(1, 0);

NSMutableArray *mutColors = [NSMutableArray arrayWithCapacity:colors.count];

for (UIColor *color in colors) {

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

}

gradientLayer.colors = [NSArray arrayWithArray:mutColors];

UIGraphicsBeginImageContextWithOptions(gradientLayer.frame.size, gradientLayer.opaque, 0);

[gradientLayer renderInContext:UIGraphicsGetCurrentContext()];

UIImage *outputImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

本着使用方便，给UIImage创建了个分类

/**

生成一张渐变色的图片

@param colors 颜色数组

@param rect 图片大小

@return 返回渐变图片

*/

+ (UIImage *)gradientImageWithColors:(NSArray *)colors rect:(CGRect)rect

{

if (!colors.count || CGRectEqualToRect(rect, CGRectZero)) {

return nil;

}

CAGradientLayer *gradientLayer = [CAGradientLayer layer];

gradientLayer.frame = rect;

gradientLayer.startPoint = CGPointMake(0, 0);

gradientLayer.endPoint = CGPointMake(1, 0);

NSMutableArray *mutColors = [NSMutableArray arrayWithCapacity:colors.count];

for (UIColor *color in colors) {

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

}

gradientLayer.colors = [NSArray arrayWithArray:mutColors];

UIGraphicsBeginImageContextWithOptions(gradientLayer.frame.size, gradientLayer.opaque, 0);

[gradientLayer renderInContext:UIGraphicsGetCurrentContext()];

UIImage *outputImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

return outputImage;

}