1

I am rotating an UIBarButtonItem. The animation is working just fine. However, I would like to stop the animation smoothly when I receive data from the server.

I tried to capture the current value using the presentationLayer but all I got is 0.

- (void)animateLeftBarButtonItem
{
    //Animate Button
    CABasicAnimation *leftBarButtonItemRotator = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    leftBarButtonItemRotator.delegate = self;
    leftBarButtonItemRotator.removedOnCompletion = NO;
    leftBarButtonItemRotator.fillMode = kCAFillModeForwards;
    leftBarButtonItemRotator.duration = 5.0;
    leftBarButtonItemRotator.fromValue = @0.0f;
    leftBarButtonItemRotator.toValue = @(50*(-2.0f * M_PI));
    leftBarButtonItemRotator.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    [self.navigationItem.leftBarButtonItem.customView.layer addAnimation:leftBarButtonItemRotator forKey:@"leftBarButtonRotation"];

}

Any suggestions?

Regards

Camus
  • 827
  • 2
  • 20
  • 36
  • -removeAnimationForKey is the method. Try http://stackoverflow.com/questions/2306870/is-there-a-way-to-pause-a-cabasicanimation http://stackoverflow.com/questions/11098802/stop-cabasicanimation-at-specific-point Good Luck !! – V.D May 05 '14 at 13:19
  • I am doing that already. The animation stops and the frame is back to the original value. However, it does not stop smoothly (EaseOut). – Camus May 06 '14 at 09:25
  • Try leftBarButtonItemRotator.fillMode = kCAFillModeRemoved – V.D May 06 '14 at 09:50
  • It didn't work either. Any other suggestion? – Camus May 06 '14 at 10:23
  • Have you tried using blocks ?! – V.D May 06 '14 at 10:36
  • No. Which block method can I use? – Camus May 06 '14 at 11:51

1 Answers1

1

Ok, I needed this badly and I spent an hour trying different hacks.

The next idea seems to be working. It's based on the fact that it seems each animation added to a layer (even if it's acting on the same property), CA mixes it. So we start another animation with same property as we want them to fade them out. When it finishes we remove the previous.

There are a couple of key parts in the sample I provide next. I bolded them.

Hope it helps.


-(void)slowBeat{


    //check if animations alredy running?

    [CATransaction begin];

    CAKeyframeAnimation* zoom = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale"];
    zoom.duration = 1.0f;
    zoom.speed = .75f;
    zoom.repeatCount = INFINITY;
    zoom.fillMode = kCAFillModeForwards;
    zoom.removedOnCompletion = YES;
    zoom.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    zoom.calculationMode = kCAAnimationCubicPaced;
    zoom.keyTimes = [NSArray arrayWithObjects:
                     [NSNumber numberWithFloat:0.0f],
                     [NSNumber numberWithFloat:0.80f],
                     [NSNumber numberWithFloat:0.95f],
                     [NSNumber numberWithFloat:1.0f], nil];

    zoom.values = [NSArray arrayWithObjects:
                   [NSNumber numberWithFloat:1.0f],
                   [NSNumber numberWithFloat:1.0f],
                   [NSNumber numberWithFloat:1.3f],
                   [NSNumber numberWithFloat:1.0f], nil];
    [self.contentWrapper.layer addAnimation:zoom forKey:@"slowBeatPosition"];

    CAKeyframeAnimation* fadeInAndOut = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];
    fadeInAndOut.duration = 1.0f;
    fadeInAndOut.speed = .75f;
    fadeInAndOut.repeatCount = INFINITY;
    fadeInAndOut.fillMode = kCAFillModeForwards;
    fadeInAndOut.removedOnCompletion = YES;
    fadeInAndOut.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    fadeInAndOut.calculationMode = kCAAnimationCubicPaced;
    fadeInAndOut.keyTimes = [NSArray arrayWithObjects:
                             [NSNumber numberWithFloat:0.0f],
                             [NSNumber numberWithFloat:0.80f],
                             [NSNumber numberWithFloat:0.95f],
                             [NSNumber numberWithFloat:1.0f], nil];

    fadeInAndOut.values = [NSArray arrayWithObjects:
                           (id)[UIColor colorWithWhite:1.0f alpha:0.1f].CGColor,
                           (id)[UIColor colorWithWhite:1.0f alpha:0.1f].CGColor,
                           (id)[UIColor colorWithWhite:1.0f alpha:0.7f].CGColor,
                           (id)[UIColor colorWithWhite:1.0f alpha:0.1f].CGColor, nil];
    [self.redView.layer addAnimation:fadeInAndOut forKey:@"slowBeatColor"];
    [CATransaction commit];

    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(3.4 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{


        [CATransaction begin];
        [CATransaction setCompletionBlock:^{
            [self.contentWrapper.layer removeAnimationForKey:@"slowBeatPosition"];
            [self.redView.layer removeAnimationForKey:@"slowBeatColor"];
            [self.contentWrapper.layer removeAnimationForKey:@"slowBeatPosition2"];
            [self.redView.layer removeAnimationForKey:@"slowBeatColor2"];
        }];
        CABasicAnimation* zoom2 = [CABasicAnimation animationWithKeyPath:@"transform"];
        zoom2.duration = 0.4f;
        zoom2.speed = 1.0f;
        zoom2.repeatCount = 1;
        zoom2.fillMode = kCAFillModeForwards;
        zoom2.removedOnCompletion = NO;
        zoom2.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
        zoom2.toValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];
        [self.contentWrapper.layer addAnimation:zoom2 forKey:@"slowBeatPosition2"];

        CABasicAnimation* fadeInAndOut2 = [CABasicAnimation animationWithKeyPath:@"backgroundColor"];
        fadeInAndOut2.duration = 0.4f;
        fadeInAndOut2.speed = 1.0f;
        fadeInAndOut2.repeatCount = 1;
        fadeInAndOut2.fillMode = kCAFillModeForwards;
        fadeInAndOut2.removedOnCompletion = NO;
        fadeInAndOut2.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
        fadeInAndOut2.toValue = (id)[UIColor colorWithWhite:1.0f alpha:0.1f].CGColor;
        [self.redView.layer addAnimation:fadeInAndOut2 forKey:@"slowBeatColor2"];
        [CATransaction commit];
    });


}

Gaston Morixe
  • 839
  • 2
  • 10
  • 21