UIImage animations don't work in a view pushed without animation

Question

I've got a view controller whose view contains a UIImageView that does animation:

//AnimationViewController::ViewDidLoad event:
var ctlAnimations = new UIImageView();

ctlAnimations.AnimationImages = list.ToArray();  //<--list contains the UIImages
ctlAnimations.AnimationDuration = 1.0 * list.Count;
ctlAnimations.StartAnimating();

this.Add(ctlAnimations);

This works perfectly: when I push AnimationViewController onto the navigation stack, it displays and animates the UIImage.

But now I need to show AnimationViewController with a custom animated transition:

var transition = CATransition.CreateAnimation ();
transition.Duration = 0.3f;
transition.TimingFunction = CAMediaTimingFunction.FromName(CAMediaTimingFunction.EaseInEaseOut);
transition.Type = CATransition.TransitionFade;
this.View.Layer.AddAnimation (transition, "fade");
//viewController is being pushed with animated=false, because we have a custom animation
base.PushViewController (viewController, false);  
this.View.Layer.RemoveAnimation("fade");

This also works perfectly, in that the new View transitions into place using the specified custom animation.

But when I push AnimationViewController onto the stack using an animated transition, it displays but the animation doesn't run. Instead, it shows the first frame of the animation (the first image in the list), and doesn't run it.

So, something about the transition is breaking the ability to animate a UIImage in the new view controller, but I simply can't figure out what to do about it.

Update: I've noticed that if I tap the NavigationController's back button, but then move off of the back button and let go (so I don't actually go back), the animation starts playing!

Answer 1

PushViewController works like this: Over the current view controller the next view controller is placed you can say pushed onto the stack. From Apple docs its clear that either you need to push view controllers either with animation or without.

Work around:

1. Set the frame of the next view controller's view's x position beyond the screen's right
2. Suppose width of the screen is 320, then set the x position of next view as 320.
3. Add the next view as subview to the existing one.
4. Now do your custom animation.

Another work around:(a bit more overhead though)

• Take a snapshot programmatically of current view.
• Add the snapshot image as the initial view of next view controller.
• Now push view controller without animation. (User will still see the old view)
• In viewDidAppear of new view controller start your custom animation.

[I have to warn you that this method of taking snapshot might give you a small delay in older devices. Newer devices are pretty fast enough you wont see any lag]

Let me know if any issues in case you are implementing any of these solutions.