Search code examples
iphoneobjective-canimationuiimageviewscaling

How to scale UIImageView properly with UIView animateWithDuration?


I'm scaling UIImageView and then reverting it using UIView animateWithDuration with UIViewAnimationOptionAutoreverse option. The problem is the image animation is a little bit jaggy (twitching) at the end of the animation. Here's my code:

[UIView animateWithDuration:0.25 delay:0 options:UIViewAnimationOptionAutoreverse 
  animations:^{

    myImage.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.9, 0.9);}  

  completion:^(BOOL finished){if (finished){

    myImage.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 1.0);}}];

I know that I'm missing something but don't know where to start :(

UPDATE1: I'm performing nested 6 animations where each next animation performs after previous one. For that I'm using block animations and performing each next animation in complete block.

UPDATE2: I have tried with UIViewAnimationOptionRepeat option but there's still some flash effect after each scale animation.


Solution

  • UIViewAnimationOptionAutoreverse does nothing without also using the UIViewAnimationOptionRepeat option. Your animation as written will shrink the image to 90%, then snap back to 100% in the completion block. Maybe you can follow this animation with another that scales back to 100% over a quarter second. Something like this:

        [UIView animateWithDuration:0.25 delay:0 options:UIViewAnimationOptionCurveEaseInOut 
                     animations:^{
                         myImage.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.9, 0.9);}  
                     completion:^(BOOL finished){if (finished){
    
        [UIView animateWithDuration:0.25 delay:0 options:UIViewAnimationOptionCurveEaseInOut 
                         animations:^{
                             myImage.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 1.0);}  
                         completion:NULL];}}];