title: CAAnimation not working as expected on CALayer
body: <p>I am trying to animate the the appearance and then the disappearance of a <code>UIBezierPath</code> in a <code>CAShapeLayer</code>. </p>
  
  <p>How I would like to do it is that at start, the path would be invisible by setting <code>strokeStart</code> and <code>strokeEnd</code> to 0. Then, in my <code>animate</code> method I would do a <code>CABasicAnimation</code> with setting the <code>strokeEnd</code> to 1, and after this is done, another animation where I set the <code>strokeStart</code> to 1, so the path would disappear again. Here is what I've tried:</p>
  
  <pre><code>- (void)animate
  {
      CAShapeLayer *layer = (CAShapeLayer *)self.layer;
  
      CABasicAnimation *appearingAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
      appearingAnimation.duration = _duration / 2.0;
      appearingAnimation.fromValue = @0;
      appearingAnimation.toValue = @1;
  
      CABasicAnimation *disappearingAnimation = [CABasicAnimation animationWithKeyPath:@"strokeStart"];
      disappearingAnimation.beginTime = _duration / 2.0;
      disappearingAnimation.duration = _duration / 2.0;
      disappearingAnimation.fromValue = @0;
      disappearingAnimation.toValue = @1;
  
      CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
      animationGroup.duration = _duration;
      animationGroup.animations = @[appearingAnimation, disappearingAnimation];
      animationGroup.repeatCount = MAXFLOAT;
      [layer addAnimation:animationGroup forKey:@"test"];
  }
  </code></pre>
  
  <p>But the effect I am seeing is that the <code>appearingAnimation</code> is working properly, but as soon as it is done, the path instantly disappears without any animation. After this (<code>_duration/2.0</code> time later) the whole thing starts over, so it would appear that the <code>disappearingAnimation</code> has no effect.</p>
  
  <p>I tried another approach, but that only worked if the path was on my <code>view.layer</code>. As soon as I added it to a sublayer and tried to animate that one, the second (disappearing) animation had a glitch in it. Here is my second approach:</p>
  
  <pre><code>- (void)animate
  {
      CAShapeLayer *layer = (CAShapeLayer *)self.layer;
  
      layer.strokeStart = 0;
      layer.strokeEnd = 1;
  
      [CATransaction begin];
      [CATransaction setCompletionBlock:^{
          layer.strokeStart = 1;
          layer.strokeEnd = 1;
  
          [CATransaction begin];
          [CATransaction setCompletionBlock:^{
               [self animate];
          }];
  
          CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeStart"];
          animation.duration = _duration / 2.0;
          animation.fromValue = [NSNumber numberWithDouble:0];
          animation.toValue = [NSNumber numberWithDouble:1];
          [layer addAnimation:animation forKey:@"animation1"];
          [CATransaction commit];
      }];
      CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
      animation.duration = _duration / 2.0;
      animation.fromValue = [NSNumber numberWithDouble:0];
      animation.toValue = [NSNumber numberWithDouble:1];
      [layer addAnimation:animation forKey:@"animation"];
      [CATransaction commit];
  }
  </code></pre>
  
  <p>Any idea why the first solution doesn't work at all, or why the second is only working properly on the <code>view.layer</code> and not on a <code>sublayer</code>?</p>