Modifying an iPhone animation container view before starting animation

Question

I am adding some basic animation to a card game I'm working on. (My first iPhone app.)

I am creating a custom UIView class "AnimationContainer", which flips from image1 to image2, while moving from rect1 to rect2. My ultimate intention is to have up to four of these containers doing their transitions simultaneously.

The problem I'm having is that the animation isn't showing image1... so only the last half of the flip transition appears.

However, if I reset the animation first by touching Reset, then everything works perfectly. In other words, if I press Flip again and again, I only get half the transition... but if I press Reset first, then everything works perfectly for one flip.

So, how can I get the animation to reset itself correctly?

Below is the code, a screenshot, and here's a link to the complete: Project Zip File 700k.

- (void)displayWithImage1 {     //RESET button calls this
    self.frame = rect1;
    [image2 removeFromSuperview];
    [self addSubview:image1];
    [self setNeedsDisplay]; //no help: doesn't force an update before animation
}

- (void)runTheAnimation {     //FLIP button calls this
    [self displayWithImage1]; //<---this is what the reset button calls
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:0.5];
    [UIView setAnimationTransition:transition forView:self cache:NO];
    self.frame = rect2;
    [image1 removeFromSuperview];
    [self addSubview:image2];
    [UIView commitAnimations];
}

Thanks!

Answer 1

You need a drawing loop to pass in order to redraw the view before performing the animation. This code is an example of "draw this, and when the next event loop comes around, do this other thing." It's not uncommon to do this in UI code. Your first work-around is attempting the same thing, but in a much more complicated way.

- (void)_runTheAnimation {
    // Moved here from -runTheAnimation
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:0.5];
    [UIView setAnimationTransition:transition forView:self cache:NO];
    self.frame = rect2;
    [image1 removeFromSuperview];
    [self addSubview:image2];
    [UIView commitAnimations];
}

- (void)runTheAnimation {     //FLIP button calls this
    [self displayWithImage1];
    [self performSelector:@selector(_runTheAnimation) withObject:nil afterDelay:0.0];
}