Animating subviews to spin image to full screen

Question

I have an UIImageView (100x100px) and when a user taps on the image I want to do an animation which brings the image to full screen.

The animation is a combination of changing the frame to full screen and a CABasicAnimation which spins the image.

I have set this up like this:

[self.view bringSubviewToFront:imageView];

CGRect originalFrame = CGRectMake(20.0, 20.0, 100.0, 100.0);
CGRect fullFrame = CGRectMake(0.0, 0.0, 320.0, 320.0);

CGRect newFrame = (isImageFullScreen ? originalFrame : fullFrame);

CABasicAnimation* spinAnimation = [CABasicAnimation
                                   animationWithKeyPath:@"transform.rotation.y"];
spinAnimation.duration = 0.5;
spinAnimation.toValue = [NSNumber numberWithFloat:2*M_PI];

[imageView.layer addAnimation:spinAnimation forKey:@"spinAnimation"];


[UIView animateWithDuration:0.6
                      delay:0.25 
                    options:UIViewAnimationOptionTransitionNone
                 animations:^{
                                imageView.frame = newFrame;
                                button.frame = newFrame;
                             } 
                 completion:nil];

The problem is with the spin animation. In my view there are some other subviews that stay on top when the image spins.

How can I make this work so the image animates on top of my other subviews?

Answer 1

Solution found.

Added: imageView.layer.zPosition = imageView.layer.bounds.size.width;