UIImage view animation from one image to another

Question

I want to grease the animation of the image in UIImageView in order to turn into the next one in one second, as UIModalTransitionStyleCrossDissolve does.

Currently I have a UIImageView * called "imageView" and a function called "imageForState" that returns me UIImage * for the correct image.

So what I want to do is to animate the image smoothly into image B, if there is one.

Currently my function is this:

- (UIImage *) imageForState{ NSLog(@"state: %d", [save state]); switch ([save state]) { case 0: case 1: return [UIImage imageNamed:@"Sakuya_Debug.PNG"]; case 2: return [UIImage imageNamed:@"Sakuya_2_Debug.PNG"]; default: return NULL; //Never called } } -(void) tap{ [imageView setAnimationImages:[NSArray arrayWithObjects:[imageView image], [self imageForState], nil]]; imageView.animationDuration = 2.0; [imageView startAnimating]; save.state++; } 

My problem is that 1.) the animation continues forever (when I set imageView.animationRepeatCount to 1, I find myself in the first image again) and b.) The animation is not smooth; just as I would use "setImage";

What am I doing wrong?

Answer 1

I suggest doing this with two imageViews and an animation block. In the following example, I assume two square images with a 100-pixel gray. If you add two images as subzones, make sure that imageB is added after image A to close it.

Initiate Images:

 UIImageView *imageA = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Sakuya_Debug.PNG"]]; UIImageView *imageB = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Sakuya_2_Debug.PNG"]]; // hide the second image imageB.alpha = 0.0; // put the image with the same size at same position imageA.frame = CGRectMake(0.0, 0.0, 100.0, 100.0); imageB.frame = imageA.frame; 

Mixing method:

 - (void)crossDissolveImageAtoB { [UIView animateWithDuration:1.0 animations:^{ imageB.alpha = 1.0; } completion:^(BOOL finished){ // do something after the animation finished, // maybe releasing imageA if it not used anymore... }]; }