Question

所以我在我的应用程序中有UIWebView，我加载了一些HTML（文章）给它，放一些CSS，使一切更好。这简单明了，一切都很完美，直到我尝试添加景观功能阅读，然后我注意到UIWebView忽略了任何CSS“font-size”我放入HTML并在旋转到横向模式后大幅增加字体大小。

我花了大约4-5个小时（我是编程Iphone应用程序的新手，但是在制作正确的东西时我很顽固）试图修复它。尝试了很多很多配置选项 - 没什么。

今晚发生了一些神奇的事情。看看来源：

使用The Bug构建景观：

r = CGRectMake(0.0, 0.0, 480.0, 320.0);
[adView.view removeFromSuperview];
if (!isFullScreen) {
    minus = 50 + minus;
    [controlsView setFrame:CGRectMake(0, r.size.height - 50, r.size.width, 50)];        
} else {
    minus = 20; 
}

[textView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];  
[scrollView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];

修复了横向（字体大小不再更改）：

r = CGRectMake(0.0, 0.0, 480.0, 320.0);
[adView.view removeFromSuperview];
if (!isFullScreen) {
    minus = 50 + minus;
    [controlsView setFrame:CGRectMake(0, r.size.height - 50, r.size.width, 50)];        
} else {
    minus = 20; 
}
[textView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];  
[scrollView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];

if (!isFullScreen) {
    minus = 1 + minus;
} else {
    minus = 20+1;   
}
[textView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];  
[scrollView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];

正如您所看到的，我只是再次添加相同的代码并将保证金（减去）增加一点。并且再次使用setFrame（不，它不会仅通过一组setFrame修复大小调整）。

我很高兴它有效，但我想知道怎么做，所以我可以“正确的方式”做到这一点，因为现在代码看起来很愚蠢并且在应用程序的底部有1点高度边距。

不要问为什么我试图再次粘贴相同的代码..

Answer 1

Safari Web Content Guide还提到了如何禁用CSS中的文本自动调整功能，这解决了我的问题。

html {
    -webkit-text-size-adjust: none; /* Never autoresize text */
}

Answer 2

神奇的解决方案是：

<meta name='viewport' content='width=device-width; initial-scale=1.0; maximum-scale=1.0;'>

如果我本周才知道的话......那么多时间，这么多神经都迷失了......

Answer 3

使用前两个答案，CSS属性：

html {
    -webkit-text-size-adjust: none; /* Never autoresize text */
}

和元标记：

<meta name='viewport' content='width=device-width; initial-scale=1.0; maximum-scale=1.0;'>

我能够使用这个javascript代码注入现有网站：

var style = document.createElement(\"style\"); 
document.head.appendChild(style); 
style.innerHTML = "html{-webkit-text-size-adjust: none;}";
var viewPortTag=document.createElement('meta');
viewPortTag.id="viewport";
viewPortTag.name = "viewport";
viewPortTag.content = "width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;";
document.getElementsByTagName('head')[0].appendChild(viewPortTag);

使用UIWebViewDelegate中的webViewDidFinishLoad：

- (void)webViewDidFinishLoad:(UIWebView *)webView{

    NSString *javascript = @"var style = document.createElement(\"style\"); document.head.appendChild(style); style.innerHTML = \"html{-webkit-text-size-adjust: none;}\";var viewPortTag=document.createElement('meta');viewPortTag.id=\"viewport\";viewPortTag.name = \"viewport\";viewPortTag.content = \"width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;\";document.getElementsByTagName('head')[0].appendChild(viewPortTag);";
    [webView stringByEvaluatingJavaScriptFromString:javascript];

}

Answer 4

您可能只需阅读此内容

https://developer.apple.com/library/content/documentation/appleapplications/reference/safariwebcontent/UsingtheViewport/UsingtheViewport.html

同样，如果只指定视口宽度，高度和初始值推断规模。如图3-15所示当相同的网页呈现时视口宽度设置为320。请注意纵向方向呈现与图中相同 3-14，但横向保持320像素的宽度，其中 更改初始比例并具有当用户放大时的效果改变横向方向。

Answer 5

我试过你的情况，但没有运气。

解决方案对我有用：

[webView reload];

Answer 6

我有另一种方法可以通过添加元素来解决它：

<table>
<tr>
<td>
  [your html content]
</td>
</tr>
</table>

旋转后UIWebView调整文本大小：寻找魔法bug或我的愚蠢的解释

6 个答案: