UIView animation curve not working easeinout

Question

I am stumped by a very simple task, I want a UIView animation to do ease in / ease out but it is always linear despite using the correct animationOption.

Here is the code which by all accounts should work, it's set in a UIViewControllerAnimatedTransitioning class but I have the same issue in a previous custom segue class;

[UIView animateWithDuration:0.4f delay:0.0f options:UIViewAnimationOptionCurveEaseInOut animations:^(void) {

        self.dimView.alpha = 1.0;
        self.imageView.frame = self.destinationRect;

    } completion:^(BOOL finished) {

        [self.imageView removeFromSuperview];
        [self.dimView removeFromSuperview];

        [transitionContext completeTransition:YES];

     }];

However, a spring animation with the following code works although I'd rather not do this.

[UIView animateWithDuration:0.8f delay:0 usingSpringWithDamping:0.7f initialSpringVelocity:2.0f options:UIViewAnimationOptionCurveEaseInOut animations:^(void) {

        self.dimView.alpha = 1.0;
        self.imageView.frame = self.destinationRect;

     } completion:^(BOOL finished){

        [self.imageView removeFromSuperview];
        [self.dimView removeFromSuperview];

        [transitionContext completeTransition:YES];

     }];

I'm getting the same behaviour on the simulator and on an iPad2 test device. Am I doing something wrong? Are there issues with animating either frame or alpha values?

score 3 · Answer 1 · answered Oct 02 '13 at 11:08

3

You could try this instead.-

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:0.4f];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:@selector(animationDidStop)];

self.dimView.alpha = 1.0;
self.imageView.frame = self.destinationRect;

[UIView commitAnimations];

- (void) animationDidStop {
    [self.imageView removeFromSuperview];
    [self.dimView removeFromSuperview];
    [transitionContext completeTransition:YES];
}

Hope it helps.

answered Oct 02 '13 at 11:08

ssantos

16,001
7
50
70

Thanks ssantos. At first I thought it did the trick but my eyes were fooling me. Still definitely linear. Very strange and annoying. – Daniel Nordh Oct 03 '13 at 12:57
Mmh weird indeed, may the distance be too small to notice the difference? I'd try a 'large' animation with different `animationCurves` just in case. – ssantos Oct 03 '13 at 13:09

itechnician · Answer 2 · 2013-10-08T11:51:47.337

You can use the following :

[self transition:left]; //Call as required

enum animationFrom {
    top,
    bottom,
    left,
    right
};

- (void)transition:(NSUInteger)index {
    CATransition *tr=[CATransition  animation];
    tr.duration=0.45;
    tr.timingFunction=[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    tr.type=kCATransitionPush;
    tr.delegate=self;
    switch (index) {
        case top:
            tr.subtype=kCATransitionFromBottom;
            break;
        case bottom:
            tr.subtype=kCATransitionFromTop;
            break;
        case left:
            tr.subtype=kCATransitionFromRight;
            break;
        case right:
            tr.subtype=kCATransitionFromLeft;
            break;
        default:
            break;
    }
    [self.view.layer addAnimation:tr forKey:nil];
}

score 1 · Answer 3 · answered Oct 08 '13 at 13:56

The default animation curve option is UIViewAnimationOptionCurveEaseInOut, so you don't need to specify this one. It is UIViewAnimationOptionCurveLinear that you have to be explicit about.

Are you sure your animation curve is linear? Try animating two views side be side, with animation duration set to a few seconds.

UIView animation curve not working easeinout

3 Answers3