Swapping a UIImageView's image while rotating and moving leaves traces of original image - iphone

Question

I am taking the "Flipped Text" imageView and rotating it while moving it downwards on the screen and adjusting the frame. I am also swapping out the image for a different, but similar image.
Everything works as indicated except for the image crossfade is still showing the original position for the fade-out instead of following the movement. This screenshot shows the original, transition and end states for the animation, and clearly shows the problem.
My code looks like this (logoImage is a UIImageView):
// Swap it
self.logoImage.image = [UIImage imageNamed:#"logo.png"];
CATransition *transition = [CATransition animation];
transition.duration = duration;
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
transition.type = kCATransitionFade;
[self.logoImage.layer addAnimation:transition forKey:nil];
// Spin it
CABasicAnimation* spinAnimation = [CABasicAnimation animationWithKeyPath:#"transform.rotation"];
spinAnimation.toValue = [NSNumber numberWithFloat:6*M_PI];
spinAnimation.duration = duration;
spinAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
spinAnimation.removedOnCompletion = YES;
spinAnimation.fillMode = kCAFillModeForwards;
[self.logoImage.layer addAnimation:spinAnimation forKey:#"spinAnimation"];
// Shrink it and Move it
CGRect newFrame = [self logoFrameForInterfaceOrientation:self.interfaceOrientation];
[UIView animateWithDuration:duration
delay:0.0
options:UIViewAnimationCurveEaseOut
animations:^{
self.logoImage.frame = newFrame;
}
completion:nil];
How can I make the crossfade of the image swap happen in place?

Answer 1

Try swapping the image in the completion block. (currently nil)
edit:
If they are substantially different, you can use a second UIImageView. Fade one out while you fade one in. You can either do this while they are translating, or wait for the "shrunken" original to arrive and fade it out while the "better" smaller version fades in.
Then remove the unneeded extra view in the completion block of that animation.