使用Core Animation图层绘制圆锥形或弧形渐变

时间:2014-01-03 13:38:51

标签: ios objective-c drawing core-animation gradient

我需要绘制一条圆形线,并使用Core Animation用渐变填充此线。这不是一个主要问题,因为我使用CAGradientLayer并使用CAShapeLayer屏蔽它。问题是渐变应该像this线程中看到的那样。

已经有很多解决方案,但让我解释为什么它们不适合我:

- 我无法使用图片,因为我需要为CAGradientLayer的位置属性数组设置动画

- 我没有使用Core Graphics来绘制所有内容,因为正如我所说的那样,我想要绘制的这个圆圈中的所有内容都应该是可动画的。

- 可用类here是一种可能的解决方案,但不是最优的,因为它需要为我需要绘制的每个圆圈提供一个新视图,这对我来说不是最佳的(如果没有其他解决方案我'也许可以使用这个)

- 我不能在this问题中使用该解决方案,因为它仅适用于简单的双色渐变

以下是我用来绘制圆圈的代码:

int radius = 100;
CAShapeLayer *circle = [CAShapeLayer layer];
circle.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(50, 60, 2.0*radius,    2.0*radius)cornerRadius:radius].CGPath;

circle.lineWidth = 10;
circle.fillColor = [UIColor clearColor].CGColor;
circle.strokeColor = [UIColor blackColor].CGColor;



CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.frame = CGRectMake(50, 60, 300, 300);
gradientLayer.startPoint = CGPointMake(0.5,1.0);
gradientLayer.endPoint = CGPointMake(0.5,0.0);
gradientLayer.frame = CGRectMake(0, 0, 300, 300);
NSMutableArray *colors = [NSMutableArray array];
NSMutableArray *locations = [NSMutableArray array];
[colors addObject:(id)[[UIColor colorWithRed:134.0/255.0 green: 234.0/255.0   blue:63.0/255.0 alpha:1.0] CGColor]];
[colors addObject:(id)[[UIColor colorWithRed:215.0/255.0 green: 82.0/255.0 blue:76.0/255.0 alpha:1.0] CGColor]];
[colors addObject:(id)[[UIColor colorWithRed:28.0/255.0 green:28.0/255.0 blue:28.0/255.0 alpha:1.0] CGColor]];
[locations addObject:(id)[NSNumber numberWithFloat:0.2]];
[locations addObject:(id)[NSNumber numberWithFloat:0.5]];
[locations addObject:(id)[NSNumber numberWithFloat:0.8]];
gradientLayer.colors = colors;
gradientLayer.locations = locations;
[gradientLayer setMask:circle];

[sender.layer addSublayer:gradientLayer];

1 个答案:

答案 0 :(得分:2)

我建议使用自定义Core Image过滤器来解决问题。

对于每个像素,您可以从滤波图像的中心计算角度。将此角度转换为介于0.0和1.0之间的值。使用这些值,您可以将颜色值映射到计算的像素。

如果你写这个“核心图像内核语言”,它应该处理得非常快。您可以使用核心动画为输入值设置动画,以对生成的渐变进行动画处理。