前几天用phonegap编译GameBuilder+CanTK时，发现HTML里的viewport无效。CanTK根据devicePixelRatio检测设备的DPI，然后用viewport设置正确的分辨率。如果viewport无效，CanTK只能以最低分辨率运行。在网上查了一下, 也没有找到系统的资料，但我知道WebView一定有相应的设置来启用viewport，结合找到的资料和phonegap的源码，终于找到了解决方法，这里总结一下：
iOS平台的解决方法：在phonegap的config.xml中增加一行配置：
<preference name="EnableViewportScale" value="true"/>
(奇怪的是此方法对android平台无效，我看了CordovaWebView.java，里面没有相关设置)
android 平台的解决方法一：修改CordovaWebView.java：
settings.getUserAgentString();
//增加下面两行代码：
settings.setUseWideViewPort(true);
settings.setLoadWithOverviewMode(true);
android 平台的解决方法二：直接修改CordovaWebView.java是个好办法，但是GameBuilder+CanTK支持phonegap的云编译，没有法直接修改CordovaWebView.java。我想到了phonegap插件，找到了一个ViewPortScale的插件，发现根本编译不了，所以自己写了一个com.tangide.viewport的插件，如果里使用GameBuilder+CanTK提供的云编译，已经内置了这个插件。插件的源码在这里：
https://github.com/drawapp8/ViewPort
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对软件开发网的支持。如果你想了解更多相关内容请查看下面相关链接
您可能感兴趣的文章:Android使用phonegap从相册里面获取照片（代码分享）APP添加CNZZ统计插件教程 Android版添加phonegapPhonegap使用拍照功能时的内存问题phonegap教程使用jspdf库在应用中生成pdf文件(pdf生成方法)android判断phonegap是否联网且加载super.loadUrl网址深入理解移动前端开发之viewport自适应布局meta标签中viewport、content、width、initial-scale、minimum-scale、maximum-scale总结通过viewport实现jsp页面支持手机缩放关于viewport,Ext.panel和Ext.form.panel的关系ExtJs 学习笔记 Ext.Panle Ext.TabPanel Ext.Viewport