如何使iOS UIWebView正确显示移动网站? [英] How to make iOS UIWebView display a mobile website correctly?

问题描述

我是iOS应用程序开发的新手，我只是尝试使用 UIWebView 在我的应用程序中显示移动网站，但效果并不理想.

I am new to iOS app development and I just tried using UIWebView to display a mobile website in my app and was not quite successful.

我所做的只是在Google的一些搜索工作中发现的一些最小的Xcode项目配置和编码:

What I did is just some minimal Xcode project configuration and coding that I found during some Googling efforts:

1. 使用 Single View在Xcode中创建一个新的iOS应用程序项目应用程序模板.

将 Web视图从对象库拖动到 View Controller Main.storyboard 的场景.

在按住Control键的同时，从 View中拖动 Web视图Controller 场景添加到 ViewController.h 编辑器，结果是像这样的源代码行:

While holding down the Control key, drag the Web View from the View Controller scene to the ViewController.h editor, resulting a source code line like this:

@property (weak, nonatomic) IBOutlet UIWebView *myWebView;

在ViewController.m中添加以下代码:

Add the following code in ViewController.m:

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    NSURL *url = [NSURL URLWithString:@"http://www.amazon.com"];
    [self.myWebView loadRequest:[NSURLRequest requestWithURL:url]];
}

这就是我所做的所有事情(以及这些教程告诉我的所有事情).在构建并运行了应用程序之后(在模拟器和真实的iPhone设备上)，该站点确实加载了该应用程序的视图(并且确实加载了移动版本而不是PC版本)，但是它显示了该站点，就好像视图太多了一样比实际的iPhone屏幕大.这是一个快照(在这种情况下为Amazon，但其他网站基本上相同):

This is all what I did (and also everything those tutorials told me). After I built and ran the app (on simulator and on real iphone device), the site did load in the app's view (and did load the mobile version instead of the PC version), but it displayed the site as if the view were much larger than the actual iphone screen. Here is a screeshot (Amazon in this case but basically the same for other sites):

如何使iOS UIWebView正确显示移动网站?

What should I do to make the iOS UIWebView display a mobile website correctly?

刚刚尝试了Dipen Chudasama的禁用"User Size Classes"选项的建议，所有这些建议中的第一次，结果确实有所变化(从左对齐到中心对齐)，但仍然没有我在寻找什么.这是屏幕截图:

Just tried Dipen Chudasama's suggestion of disabling the "User Size Classes" option, for the first time of all those suggestions, the result did change a little bit (from left-align to sort of center-align), but still not what I am looking for. Here is the screenshot:

编辑:

感谢热情的人们给出的所有建议.据我了解，在UIWebView中加载amazon.com之类的网站应该是一个相当容易的任务，但是，我没有获得任何建议.

Thanks for all the suggestions given by you enthusiastic people. Loading a site like amazon.com in a UIWebView should be a rather easy task as I understand, nevertheless, I didn't succeed with any of the suggestions.

如果任何人都可以(通过Github等)与我共享一个样本xcode项目(从零开始，使用最新版本的xcode工具链开始)，而没有一个可以正确加载amazon.com的UIWebView，那就太好了.这样一来，我就可以逐行执行diff，也许可以找到自己的项目中做错的事情.

It would be great if anyone could share with me (via Github or alike) just an sample xcode project (starting from scratch with the latest version of xcode tool chain) with nothing but a UIWebView that could load amazon.com correctly. That way I can do a line by line diff and may be able to find what I did wrong in my own project.

推荐答案

UIWebView具有一个名为"scalesPageToFit"的属性:

The UIWebView has a property called "scalesPageToFit":

self.myWebView.scalesPageToFit = YES;
self.myWebView.contentMode = UIViewContentModeScaleAspectFit;

应该可以解决问题.

这篇关于如何使iOS UIWebView正确显示移动网站?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！