如何在不使用遮罩的情况下为cashapelayer设置渐变填充颜色？

问题描述：

如何为cashapelayer设置渐变填充颜色？有更清楚的解释相关问题： Using Cocoa To Follow A Path With A Gradient 如何在不使用遮罩的情况下为cashapelayer设置渐变填充颜色？

我需要一个渐变，不是面具，而是基于cashapelayer的路径图上的梯度。

我不能在顶部使用渐变遮罩，因为我在我的游戏中制作小地图上的路线。所以如果玩家走过他自己的轨道，它应该是不同的颜色。

我希望像这样的MapView的折线：
^{来源：http://cdn4.raywenderlich.com/wp-content/uploads/2014/06/23_multicolor_polyline.png}

我所做出的小地图路线：记录用户的所有不同的方向，然后通过一个循环到贝塞尔路径运行它们。

我附加了Bezier路径，然后把它放在一个cashapelayer上。

在cashapelayer中有多彩的方法吗？

是否有可以放置渐变的cabasicanimation关键路径？

我的代码在下面，还有一些图片。

[mymapview.layer.sublayers makeObjectsPerformSelector:@selector(removeFromSuperlayer)]; 
[[mymapview subviews] 
makeObjectsPerformSelector:@selector(removeFromSuperview)]; 
int i = 0; 
int x = 17; 
int y = 272; 
int m = 16; 
UIBezierPath *kpath = [UIBezierPath bezierPath]; while (i < HistDirections.count) 
{ 
    if (i > 0) 
    { 
      UIBezierPath *path = [UIBezierPath bezierPath]; 
      [path moveToPoint:CGPointMake(x, y)]; 
      if ([[HistDirections objectAtIndex:i] intValue] ==1) 
      { 
       [path addLineToPoint:CGPointMake(x, y-m)]; 
       y = y - m; 
      } 
      else if ([[HistDirections objectAtIndex:i] intValue] ==2) 
      { 
       [path addLineToPoint:CGPointMake(x-m, y)]; 
       x = x -m; 
      } 
      else if ([[HistDirections objectAtIndex:i] intValue] ==3) 
      { 
       [path addLineToPoint:CGPointMake(x+m, y)]; 
       x = x+m; 
      } 
      else 
      { 
       [path addLineToPoint:CGPointMake(x, y+m)]; 
       y = y - m; 
      } 
     [kpath appendPath:path]; 
    } 
    i++; 
} 
[CATransaction begin]; 
[CATransaction setAnimationTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]]; 
[CATransaction setCompletionBlock:^{ 
    UIImageView *viewpulse = [[UIImageView alloc] initWithFrame:CGRectMake(x -5, y-5, 10.0, 10.0)]; 
    viewpulse.image = [UIImage imageNamed:@"arro.png"]; 
    viewpulse.backgroundColor = [UIColor clearColor]; 
    if(direction == 1) 
    { 
     viewpulse.transform = CGAffineTransformMakeRotation(-M_PI/2); 
    } 
    else if (direction == 2) 
    { 
     viewpulse.transform = CGAffineTransformMakeRotation(M_PI); 
    } 
    else if (direction == 4) 
    { 
     viewpulse.transform = CGAffineTransformMakeRotation(M_PI/2); 
    } 
    [mymapview addSubview:viewpulse]; 
    CABasicAnimation *scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"]; 
    scaleAnimation.duration = 0.8; 
    scaleAnimation.repeatCount = HUGE_VAL; 
    scaleAnimation.autoreverses = YES; 
    scaleAnimation.fromValue = [NSNumber numberWithFloat:1.6]; 
    scaleAnimation.toValue = [NSNumber numberWithFloat:0.8]; 
    [viewpulse.layer addAnimation:scaleAnimation forKey:@"scale"]; 
}]; 
CAShapeLayer *shapeLayer = [CAShapeLayer layer]; 

kpath.lineCapStyle = kCGLineCapRound; 
kpath.lineCapStyle = kCGLineJoinRound; 

shapeLayer.path = [kpath CGPath]; 

shapeLayer.strokeColor = [[UIColor colorWithRed:51/255.0f green:(51)/255.0f blue:170/255.0f alpha:1.0f] CGColor]; 
shapeLayer.lineWidth = 4.0; 
shapeLayer.lineCap = kCALineCapRound; 
shapeLayer.fillColor = [[UIColor clearColor] CGColor]; 
[mymapview.layer addSublayer:shapeLayer]; 

CABasicAnimation *HAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"]; 
float dur = (HistDirections.count * 0.27); 
if (dur > 2) 
{ 
    dur = 2; 
} 
HAnimation.duration   = dur; 
HAnimation.repeatCount   = 1.0; 
HAnimation.fromValue = [NSNumber numberWithFloat:0.0f]; 
HAnimation.toValue = [NSNumber numberWithFloat:1.0f]; 



/* 
CAGradientLayer *gradientLayer = [CAGradientLayer layer]; 
gradientLayer.frame = mymapview.frame; 
gradientLayer.colors = @[(__bridge id)[UIColor blueColor].CGColor,(__bridge id)[UIColor greenColor].CGColor,(__bridge id)[UIColor yellowColor].CGColor,(__bridge id)[UIColor orangeColor].CGColor, (__bridge id)[UIColor redColor].CGColor]; 
gradientLayer.startPoint = CGPointMake(0,0.5); 
gradientLayer.endPoint = CGPointMake(1,0.5); 

[mymapview.layer addSublayer:gradientLayer]; 
gradientLayer.mask = shapeLayer;*/ 
[CATransaction commit];

梯度面膜：

单色线：

答

没关系！我想清楚我能做什么。由于我从多个路径创建图层，因此我只是将cg路径放入数组中，并将每个路径循环到一个具有自己颜色的独特cashapelayer中

如何在不使用遮罩的情况下为cashapelayer设置渐变填充颜色？

相关推荐