Ahmed Z.
Ahmed Z.

Reputation: 2337

iOS animation with duration and autoreverse

I am animating an UIImageView with the UIView block API. My animation fades the UIImageView In and Out continuously. How can I animate this only for a specific time duration ?

I have put up this piece of code

float tempDuration = 5.0;
[UIView animateWithDuration:tempDuration
                          delay:0
                        options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionAllowUserInteraction
                     animations:^{
                         _imageView.alpha = 1;
                     }
                     completion:nil];

Upvotes: 0

Views: 5800

Answers (3)

Tiago Almeida
Tiago Almeida

Reputation: 14237

First of all allow me to introduce an article that is awesome to understand some features of the animations:

Controlling Animation Timming

In this article you have a part that shows what you want.

You want something like this:

enter image description here

Therefore you can configure that in the following way:

-(void) animateImageView:(UIImageView*) imageView 
            withDuration:(int) duration 
         withRepeatCount: (int) repeatCount {

     CABasicAnimation *opacityAnim = [CABasicAnimation animationWithKeyPath:@"opacity"];
     opacityAnim.fromValue = @1.0;
     opacityAnim.toValue = @0.0;
     opacityAnim.autoreverses = YES;
     opacityAnim.duration = duration/2.0/repeatCount;
     opacityAnim.removedOnCompletion = YES;
     opacityAnim.repeatCount = repeatCount;
     [imageView.layer addAnimation:opacityAnim forKey:nil];
 }

This way you guarantee that your animation will always be 5 seconds and you can tune in the number of repetitions.

Upvotes: 7

iiFreeman
iiFreeman

Reputation: 5175

Maybe you could try CABasicAnimation instead if [UIView animateWithDiration: ... ]

it should be something like this:

  CABasicAnimation *opacityAnim = [CABasicAnimation animationWithKeyPath:@"opacity"];
  opacityAnim.fromValue = [NSNumber numberWithFloat:1.0];
  opacityAnim.toValue = [NSNumber numberWithFloat:0.0];
  opacityAnim.autoreverses = YES;
  opacityAnim.duration = duration;
  opacityAnim.removedOnCompletion = YES;
  opacityAnim.repeatCount = 5;
  [imageView.layer addAnimation:opacityAnim forKey:nil];

Upvotes: 3

Yuvrajsinh
Yuvrajsinh

Reputation: 4584

You can do the following changes to do your work.

- (void)animateImageView{
    static int animcount = 1;
    float tempDuration = 1.0;
    [UIView animateWithDuration:tempDuration
                          delay:0
                        options: UIViewAnimationOptionAutoreverse
                     animations:^{
                         self.imgView.alpha = 1;
                     }
                     completion:^(BOOL finished) {
                         if(finished && animcount<5){
                             animcount+=1;
                             [self animateImageView];
                         }
                         else if (finished && animcount==5){
                             [self.imgView.layer removeAllAnimations];
                         }

                     }];
}

Upvotes: 0

Related Questions