在iOS上使用渐变填充路径

时间:2012-04-06 14:16:37

标签: ios uibezierpath cagradientlayer

CAShapeLayer上,我已经关闭了UIBezierPath。我可以通过设置fillColor填充此形状,但我想用渐变填充形状。如何设置CAGradientLayer以使其剪切为贝塞尔曲线所概述的形状?

2 个答案:

答案 0 :(得分:20)

草案示例如下:

...
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef context = UIGraphicsGetCurrentContext();

UIColor *gradientColor = [UIColor colorWithRed:0.51 green:0.0 blue:0.49 alpha:1.0];

NSArray *gradientColors = [NSArray arrayWithObjects: 
                          (id)[UIColor blueColor].CGColor, 
                          (id)gradientColor.CGColor, 
                          (id)[UIColor redColor].CGColor, nil];
CGFloat gradientLocations[] = {0, 0.5, 1};
CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (CFArrayRef)gradientColors, gradientLocations);

UIBezierPath *roundedRectanglePath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(10, 10, 200, 200) cornerRadius:6];
CGContextSaveGState(context);
[roundedRectanglePath fill];
[roundedRectanglePath addClip];
CGContextDrawLinearGradient(context, gradient, CGPointMake(10, 10), CGPointMake(210, 10), 0);
CGColorSpaceRelease(colorSpace);
CGGradientRelease(gradient);

...

答案 1 :(得分:5)

你想要的是一个面具。 CAGradientlayer有一个-setMask方法,可以将它剪切到你的形状边界,如下所示:

[gradientLayer setMask:shapeLayer];