Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

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)

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
605 views
Welcome To Ask or Share your Answers For Others

1 Answer

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'. enter image description here


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...