Question

I’m trying to animate a UIWebview being removed from the screen. I’m using an animation block to set the frame height to 0. That works fine, the problem is the content size of the web view immediately takes the new frame height. So the content disappears and the background animates off. How can I stop that from happening? Here’s my animation block.

// Change frame height.
[UIView animateWithDuration:1.0f
                 animations:^ {
                     // Animate the frame to the full height
                     self.frame = CGRectMake(self.frame.origin.x, self.frame.origin.y, self.frame.size.width, 0);
                 }
 ];

Thanks

Answer 1

So if you want the content to remain where it is, you’ll probably have to ‘cheat’ this.

Apple do this themselves on many transitions – if you go into slow animation mode on the iOS simulator, or on Mac OS you can see how it works. Unfortunately a UIWebView is very limited in scope for customisation…the only property that controls scaling is the scalesToFit value.

A different approach would be to capture the UIWebView as an image, replace the webview with that image (to the user this is seamless), and then perform the animation on the image itself. Since you’re just changing the frame of a straight forward image you then won’t run into any of these problems (you can also change the animation effect: if you image scales to fit the frame the content will be ‘squeezed’, or you can just have it cropped).