SO 和互联网的其他部分有数百篇关于尝试修复 Android 中的视口(viewport)缩放的帖子,我现在相当确定你不能在 Android 4.1 的 webview 中设置初始比例。
我正在构建一个 Cordova (Phonegap) 应用程序,我已经在 iPhone 3GS、4S 和 5 以及 iPad 2 上很好地缩放了所有东西,在 iOS6 上运行 iOS7 和 3GS
我还调整了 UI 以适应 Moto G、LG Nexus 5、Google Nexus 5 和三星 Galaxy S4,它们都运行 Android 4.4
但是在运行 Android 4.1 的三星 Galaxy S2 和 S3 Mini 上,我无法设置初始比例。
HTML 视口(viewport)元标记在 4.1 或 4.4 上不起作用(在 Chrome 中有效,在 WebView 或默认浏览器中无效):
<meta name="viewport" content="user-scalable=no, initial-scale=0.5, width=device-width, height=device-height, target-densitydpi=device-dpi" />
我已经从 cli 中创建了一个绝对基本的 Cordova 项目,cordova create basicProject
,如果我在主 Activity 的 onCreate 方法中添加一些 Java,特别是 setInitialScale
方法:
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.init();
// Set by <content src="index.html" /> in config.xml
super.loadUrl(Config.getStartUrl());
//super.loadUrl("file:///android_asset/www/index.html");
this.appView.setInitialScale( 50 );
}
然后我按预期获得了 4.4 缩放比例的 Moto G:
但在 Galaxy S2 上运行的完全相同的项目不会缩放。
我仅限于在 4.1 的三星设备或 4.4 的一系列设备上进行测试,因此如果有人可以在 4.2 或 4.3 上测试相同的东西,或者 4.1 上的任何人而不是三星,那将会很有帮助。
有谁知道如何让 Android 4.1 服从 setInitialScale()
最佳答案
您应该能够向您的网页添加一些 javascript,以便在您的 webview 拾取时缩放内容。下面是一个示例,它将缩放您的 html 内容,以便内容适合屏幕的可用宽度:
function customScaleThisScreen()
var contentWidth = document.body.scrollWidth,
windowWidth = window.innerWidth,
newScale = windowWidth / contentWidth;
document.body.style.zoom = newScale;
}
这将适用于较旧的(4.2 之前)和较新的基于 chromium 的 (4.2+) webviews。
关于Android 4.1 视口(viewport)缩放(setInitialScale,meta initial-scale 不工作),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24636515/