在iOS和Android不同的字体大小 [英] font size different on ios and android

问题描述

在Android上的WebView，我加载一个包含HTML5画布上的HTML文件。当写入文本到画布上，这是非常小的。如果我在IOS在PC浏览器，甚至Web视图加载相同的HTML文件时，它看起来是正确的。至于我可以告诉大家，我有残疾缩放和画​​布填充整个Web视图。我期望的字体大小是一样的，当在其他浏览器加载。任何想法？

In a webview on Android, I load an html file that contains an HTML5 canvas. When writing text to the canvas, it is extremely small. If I load the same html file in a PC browser or even a web view on IOS, it looks correct. As far as I can tell, I have disabled zooming, and the canvas is filling the entire web view. I would expect the font size to be the same as when loaded in other browsers. Any ideas?

在HTML文件的头部，视口被声明为：

In the head of the html file, the viewport is declared as:

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

在HTML文件的主体，画布声明为：

in the body of the html file, the canvas is declared as:

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

在页面加载

之后，我动态调整画布，以填补屏幕。

after the page is loaded, I dynamically adjust the canvas to fill the screen.

推荐答案

您设置密度为1.0，并告诉Android的WebView功能不是当你宣布在特定的方式视口都扩展任何东西。您可以删除该视申报，这便会导致图像缩放，以及字体，也可以修改根据用户正在运行你的应用程序在Android设备上的web视图的文本大小设置。我假设你想要做的是后者。

You set the density to 1.0 and tell Android's WebView not to scale anything at all when you declared your viewport in that specific way. You can either remove that viewport declaration, which will then cause images to be scaled as well as fonts or you can modify the text size settings of the WebView based on the Android device that the user is running your application on. I'll assume you want to do the latter.

您首先需要计算设备的密度。你可以做到这一点与这块code：

You'll need to first calculate the density of the device. You can do that with this piece of code:

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

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

Then you can adjust the font size for the density.

如果密度为1.0，那么它是介质密度（MDPI），> = 1.5的高密度（HDPI）和> = 2.0是超高密度（xhdpi）。

If density is 1.0, then it is medium density (mdpi), >= 1.5 is high density (hdpi) and >= 2.0 is extra high density (xhdpi).

如果您正在使用ICS，那么它有一个很好的API的WebView：

If you are using ICS, then it has a nice API for WebView:

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

如果您使用的是pre-ICS设备，那么你必须使用if / else语句来检查上面的密度，然后使用：

If you are using a pre-ICS device, then you have to use an if/else statement to check for the densities above and then use:

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中如果ICS /别人pre-ICS换两个。

Or better yet, you can wrap both of those in an if ICS/else pre-ICS by checking Build.VERSION.SDK_INT.

下面是一些进一步的念叨密度： http://developer.android.com/引导/做法/ screens_support.html

Here is some further reading about density: http://developer.android.com/guide/practices/screens_support.html

这篇关于在iOS和Android不同的字体大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！