Quartz2D之渐变使用初步

转载

mb5fcf3d80e40fa 2012-03-09 07:00:00

Quartz2D提供了两种渐变填充方法。第一种是使用Quartz自带的Gradient填充方法；第二种是使用自定义的着色器。

这里将先描述如何使用CGGradient对象来做渐变填充。

01
// Drawing code
02
// 创建Quartz上下文
03
CGContextRef context = UIGraphicsGetCurrentContext();
04
// 创建色彩空间对象
05
CGColorSpaceRef colorSpaceRef = CGColorSpaceCreateDeviceRGB();
06
// 创建起点颜色
07
CGColorRef beginColor = CGColorCreate(colorSpaceRef, (CGFloat[]){0.01f, 0.99f, 0.01f, 1.0f});
08
// 创建终点颜色
09
CGColorRef endColor = CGColorCreate(colorSpaceRef, (CGFloat[]){0.99f, 0.99f, 0.01f, 1.0f});
10
// 创建颜色数组
11
CFArrayRef colorArray = CFArrayCreate(kCFAllocatorDefault, (const void*[]){beginColor, endColor}, 2, nil);
12
// 创建渐变对象
13
CGGradientRef gradientRef = CGGradientCreateWithColors(colorSpaceRef, colorArray, (CGFloat[]){
14
0.0f,       // 对应起点颜色位置
15
1.0f        // 对应终点颜色位置
16
});
17
// 释放颜色数组
18
CFRelease(colorArray);
19
// 释放起点和终点颜色
20
CGColorRelease(beginColor);
21
CGColorRelease(endColor);
22
// 释放色彩空间
23
CGColorSpaceRelease(colorSpaceRef);
24
CGContextDrawLinearGradient(context, gradientRef, CGPointMake(0.0f, 0.0f), CGPointMake(320.0f, 460.0f), 0);
25
// 释放渐变对象
26
CGGradientRelease(gradientRef);

上述代码效果将产生一个由绿到蓝的一个渐变填充矩形。

这里使用了CGColor和CFArray来作为设置渐变颜色的参数。另外， CGGradientCreateWithColors的最后一个locations参数可以传空，这样默认为从0.0到1.0。

Quartz2D之渐变使用初步_色彩空间

// 渐变色 gradient
CGFloat colors [] = { 
1.0, 1.0, 1.0, 1.0, 
1.0, 0.0, 0.0, 1.0, 
0.0, 0.0, 0.0, 1.0
};
CGFloat locations[] = {
0.0f,0.5f,1.0f
};
CGColorSpaceRef baseSpace = CGColorSpaceCreateDeviceRGB();
CGGradientRef gradient = CGGradientCreateWithColorComponents(baseSpace, colors, locations, sizeof(colors)/(sizeof(colors[0])*4));
CGColorSpaceRelease(baseSpace), baseSpace = NULL;

CGContextRef context = UIGraphicsGetCurrentContext();
CGRect aRect = CGRectInset(CGContextGetClipBoundingBox(context), 50.0f, 20.0f);
CGContextSaveGState(context); // SaveGState
CGContextClipToRect(context, aRect);

CGPoint startPoint = CGPointMake(CGRectGetMidX(aRect), CGRectGetMinY(aRect)); 
CGPoint endPoint = CGPointMake(CGRectGetMidX(aRect), CGRectGetMaxY(aRect)); 

// kCGGradientDrawsBeforeStartLocation 开始位置之外的也画
// kCGGradientDrawsAfterEndLocation 结束位置之外的也画
// 0 正常状态
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
CGGradientRelease(gradient), gradient = NULL;

CGContextRestoreGState(context); // RestoreGState
CGContextDrawPath(context, kCGPathStroke);