I'm coding an iPhone app in which I have a UIWebView
that loads a website with a responsive design.
The problem I have is when I rotate the devices to landscape: the UIWebView
rotates but it keeps the same width as the portrait mode.
I spent the last 5 hours searching all over the net, I found some solutions that I used but without success...
in my html page i'm using
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
i tried using
<meta name="viewport" content="width=device-width" />
nothing changed, in my code I'm implementing the following function to handle the rotate, but it gives nothing
- (void) didRotateFromInterfaceOrientation: (UIInterfaceOrientation)fromInterfaceOrientation
{
[self.myWebView stringByEvaluatingJavaScriptFromString:
[NSString stringWithFormat:
@"document.querySelector('meta[name=viewport]').setAttribute('content', 'width=%d;', false); ",
(int)self.myWebView.frame.size.width]];
NSLog(@"orientation width: %d", (int)self.myWebView.frame.size.width);
}
I also checked the "Scale Page to Fit" checkbox,
(using xcode 5, with an iphone4s and ios7)
Try setting constraints on the UIWebView. When the View rotated, the space constraints should automatically adjust.
In the storyboard, look for the menu icons in the lower right. Select the auto layout icon (looks like a tie fighter), and then select either 'Add Missing Constraints' or 'Reset to Suggested Constraints'.