2010-06-06 68 views
36

填充純色的路徑是很容易的:如何用drawRect中的漸變填充路徑:?

CGPoint aPoint; 
for (id pointValue in points) 
{ 
    aPoint = [pointValue CGPointValue]; 
    CGContextAddLineToPoint(context, aPoint.x, aPoint.y); 
} 
[[UIColor redColor] setFill]; 
[[UIColor blackColor] setStroke]; 
CGContextDrawPath(context, kCGPathFillStroke); 

我想繪製一個漸變的,而不是純紅色,但我有麻煩了。 我試着在問題/答案上市代碼:Gradients on UIView and UILabels On iPhone

是:

CAGradientLayer *gradient = [CAGradientLayer layer]; 
[gradient setFrame:rect]; 
[gradient setColors:[NSArray arrayWithObjects:(id)[[UIColor blueColor] CGColor], 
       (id)[[UIColor whiteColor] CGColor], nil]]; 
[[self layer] setMasksToBounds:YES]; 

[[self layer] insertSublayer:gradient atIndex:0]; 

然而,這種描繪整個認爲,這是在與梯度,覆蓋了我原來的路徑。

回答

89

我會剪裁到您想要填充的路徑,並使用CGContextDrawLinearGradient。下面是一個簡單的drawRect實現:作爲一個例子:

- (void) drawRect:(CGRect)rect 
{ 
    // Create a gradient from white to red 
    CGFloat colors [] = { 
     1.0, 1.0, 1.0, 1.0, 
     1.0, 0.0, 0.0, 1.0 
    }; 

    CGColorSpaceRef baseSpace = CGColorSpaceCreateDeviceRGB(); 
    CGGradientRef gradient = CGGradientCreateWithColorComponents(baseSpace, colors, NULL, 2); 
    CGColorSpaceRelease(baseSpace), baseSpace = NULL; 

    CGContextRef context = UIGraphicsGetCurrentContext(); 

    CGContextSaveGState(context); 
    CGContextAddEllipseInRect(context, rect); 
    CGContextClip(context); 

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

    CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0); 
    CGGradientRelease(gradient), gradient = NULL; 

    CGContextRestoreGState(context); 

    CGContextAddEllipseInRect(context, rect); 
    CGContextDrawPath(context, kCGPathStroke); 
} 
+1

如果我能給你一個真棒徽章,我會的! 你知道關於CGContextSaveGState和東西的任何教程嗎?因爲蘋果類的參考很薄。 – Derrick 2010-06-06 20:04:49

+0

Derrick:Quartz 2D Programming Guide涵蓋了以及其他一切:http://developer.apple.com/mac/library/documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/dq_overview/dq_overview.html#//apple_ref/doc/ uid/TP30001066-CH202-TPXREF132 – 2010-06-06 20:50:14

+1

使用示例代碼後,我的影子消失了。我已經嘗試在gstate保存之前重新定位陰影線(「CGContextSetShadow(context,CGSizeMake(5.0,-5.0),4);」),在它之後,在gstate恢復之後,在裁剪之前和之後,幫助。 – Doron 2010-07-03 12:35:18