UIWebView Screen Fitting Issue

Question

I have developed a website in Twitter Bootstrap, I am now using a UIWebView to display that site inside of an IOS app. I am getting it to display fine, but the screen is off and it is running off of the side of the screen... I feel like I might have my UIWebView configured wrong, the site looks like if I go to it in Safari on my mobile device, so I know the site is working properly.

It even displays Google wrong in the UIWebView.... I will display my code and 2 screen shots below(The first screenshot is what it currently looks like, the second is what it should look like and what it looks like in safari mobile :

ViewController.h

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property (strong, nonatomic) IBOutlet UIWebView *webView;

@end

ViewController.m

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
[super viewDidLoad];

NSURL *url = [NSURL URLWithString:@"http://www.google.com"];
NSURLRequest *request = [NSURLRequest requestWithURL:url];

[_webView loadRequest:request];
_webView.scalesPageToFit = YES;
_webView.frame=self.view.bounds;

[_webView loadRequest:request];
}

- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

@end

AS-IS Screen Shot

TO-BE Screen Shot

Answer 1

To me it looks like the UIWebView is not set up correctly in the Storyboard or Interface Builder. Do you use Auto Layout? If so, are the constraints set correctly?

A simple way to make sure the UIWebView is displayed full screen would be to add 4 constraints that align it with the top, bottom, leading and trailing edges of its superview, e.g. like so:

EDIT: Here are some rough instructions on how to add those constraints.

Answer 2

You should add the following code after [_webView loadRequest:request]; :

_webView.scalesPageToFit = YES;

and If your UIWebView is not located properly, add the following code too :

_webView.frame=self.view.bounds;

Answer 3

In the Utilities pane, select "Scales Pages to Fit":

In the view controller in which the web view resides, make sure you can view the boxes (or bounds) of the view (note: the bottom doesn't appear because I couldn't fit it within the image):

Code in view controller:

#import "SomeViewController.h"

@interface SomeViewController ()

@end

@implementation SomeViewController
@synthesize webView;

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    NSString *urlLink = @"www.google.com";
    NSURL *url = [NSURL URLWithString:urlLink];
    NSURLRequest *urlRequest = [NSURLRequest requestWithURL:url];
    [self.webview loadRequest:urlRequest];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

Photo of the other settings in the view controller:

Answer 4

No need to use loadRequest: two time, Use:

- (void)viewDidAppear:(BOOL)animated{
    [super viewDidAppear:animated];
    [_webView reload];
}