UIBezierPath 脉冲动画答案

【问题标题】：UIBezierPath pulse animationUIBezierPath 脉冲动画
【发布时间】：2013-10-31 14:00:04
【问题描述】：

我在UIScrollView 上绘制UIBezierPath 我制作了一个动画，绘制了从起点到终点的路径，但这不是我想要的动画。

   UIBezierPath *linePath = [UIBezierPath bezierPath];
    [linePath moveToPoint:startPoints];  
    [linePath addLineToPoint:endPoints; 


    //shape layer for the line
    CAShapeLayer *line = [CAShapeLayer layer];
    line.path = [linePath CGPath];
    // line.fillColor = [[UIColor blackColor] CGColor];
    line.strokeColor = [[colors objectAtIndex:i] CGColor];
    line.lineWidth = 5;
   // line.contents = (id)[[UIImage imageNamed:@"Mask.png"] CGImage];
   // line.contentsGravity = kCAGravityCenter;



    CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    pathAnimation.duration = 3.0;
    pathAnimation.fromValue = @(0.0f);
    pathAnimation.toValue = @(1.0f);
    pathAnimation.repeatCount = HUGE_VAL;
    [line addAnimation:pathAnimation forKey:@"strokeEnd"];

我尝试将contents 添加到形状层，但我不擅长动画。我想要实现的效果是与“滑动解锁”具有相同的动画，或者是一个脉冲的路径。

我尝试做与slide-to-unlock 的回答相同的事情，但似乎无法管理

【问题讨论】：

标签： calayer uibezierpath cabasicanimation cashapelayer pulse

【解决方案1】：

我最终这样做了：

UIBezierPath *linePath = [UIBezierPath bezierPath];
[linePath moveToPoint:startPoints];
[linePath addLineToPoint:endPoints];

//gradient layer for the line


CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = CGRectMake(0, 0, 150.0, 1.0);
gradient.cornerRadius = 5.0f;
gradient.startPoint = CGPointMake(0.0, 0.5);
gradient.endPoint = CGPointMake(1.0, 0.5);
gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor clearColor] CGColor],(id)[[UIColor whiteColor] CGColor],(id)[[UIColor blueColor] CGColor],(id)[[UIColor clearColor] CGColor], nil];
[scrollViewContent.layer addSublayer:gradient];



CAKeyframeAnimation *anim = [CAKeyframeAnimation animationWithKeyPath:@"position"];
anim.path = [linePath CGPath];
anim.rotationMode = kCAAnimationRotateAuto;
anim.repeatCount = 0;
anim.duration = 1;
[gradient addAnimation:anim forKey:@"gradient"];

【讨论】：