ios和android上的字体大小不同

时间:2012-03-08 21:45:47

标签: android android-webview

在Android上的webview中,我加载了一个包含HTML5画布的html文件。将文本写入画布时,它非常小。如果我在PC浏览器中加载相同的html文件,甚至在IOS上加载Web视图,它看起来是正确的。据我所知,我已禁用缩放,并且画布正在填充整个Web视图。我希望字体大小与在其他浏览器中加载时相同。有什么想法吗?

在html文件的头部,视口声明为:

<meta name='viewport' content='target-densitydpi=device-dpi,initial-scale=1.0,user-scalable=no'/>

在html文件的正文中,画布声明为:

<canvas id='rtmc_canvas' style='position:relative; left:0px; top:0px;'/>

加载页面后,我动态调整画布以填充屏幕。

1 个答案:

答案 0 :(得分:4)

您将密度设置为1.0,并告诉Android的WebView在您以特定方式声明视口时根本不缩放任何内容。您可以删除该视口声明,这将导致图像缩放以及字体,或者您可以根据用户正在运行您的应用程序的Android设备修改WebView的文本大小设置。我假设你想做后者。

您需要先计算设备的密度。你可以用这段代码来做到这一点:

float density = getResources().getDisplayMetrics().density;

然后您可以调整密度的字体大小。

如果密度为1.0,则其为中密度(mdpi),> = 1.5为高密度(hdpi)且> = 2.0为超高密度(xhdpi)。

如果您使用的是ICS,那么它有一个很好的WebView API:

webView.getSettings().setTextZoom(100 * density);

如果您使用的是pre-ICS设备,则必须使用if / else语句检查上面的密度,然后使用:

if (density < 1.5) {
    // mdpi:
    webView.getSettings().setTextSize(WebSettings.TextSize.NORMAL);
} else if ((density >= 1.5) && (density < 2.0)) {
    // hdpi:
    webView.getSettings().setTextSize(WebSettings.TextSize.LARGER);
} else {
    // xhdpi:
    webView.getSettings().setTextSize(WebSettings.TextSize.LARGEST);
}

或者更好的是,你可以通过检查Build.VERSION.SDK_INT将这两个包装在if ICS / else pre-ICS中。

以下是关于密度的进一步阅读:http://developer.android.com/guide/practices/screens_support.html