Question

我有一个建立在PrimeFaces之上的网站。我的问题是WebView上的内容和图像看起来比Chrome上的要大。如何使WebView上的渲染与Chrome的渲染相同？

扩展似乎没有帮助，因为该网站具有响应式设计。我还尝试了wrap_content而不是fill_parent但没有成功。

更新1 ：以下内容无效。我已将它们从下面的代码中排除，以保持最小化。

WebViewClient
ChromeViewClient
setLoadWithOverviewMode(true)
setUseWideViewPort(true)

更新2 ： setInitialScale()无效。

MyActivity.java

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    webView = (WebView) findViewById(R.id.web_engine);
    webView.setWebViewClient(new WebViewClient());
    webView.getSettings().setJavaScriptEnabled(true);
    if (savedInstanceState == null) {
        webView.loadUrl("http://www.primefaces.org/showcase/mobile/index.xhtml");
    }
}

main.xml中

<RelativeLayout xmlns:a="http://schemas.android.com/apk/res/android"
            a:layout_width="fill_parent"
            a:layout_height="fill_parent"
            a:background="#ffffff"
            a:orientation="vertical" >

<WebView a:id="@+id/web_engine"
         a:layout_width="fill_parent"
         a:layout_height="fill_parent"
/>

WebView Chrome

Answer 1

尝试：

webView.getSettings().setLayoutAlgorithm(WebSettings.LayoutAlgorithm.TEXT_AUTOSIZING);
webView.getSettings().setSupportZoom(true);

这里提到：http://developer.android.com/guide/webapps/migrating.html

更具体地说：http://developer.android.com/reference/android/webkit/WebSettings.LayoutAlgorithm.html#TEXT_AUTOSIZING

完整代码：

mWebView = (WebView) mLayoutMain.findViewById(R.id.webview_main);
mWebView.setWebViewClient(new WebViewClient(){
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        view.loadUrl(url);
        return false;
    }
});
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.getSettings().setUseWideViewPort(true);
mWebView.getSettings().setLoadWithOverviewMode(true);
mWebView.getSettings().setBuiltInZoomControls(true);
mWebView.getSettings().setLayoutAlgorithm(WebSettings.LayoutAlgorithm.TEXT_AUTOSIZING);
mWebView.getSettings().setSupportZoom(true);
mWebView.loadUrl("http://www.primefaces.org/showcase/mobile/index.xhtml");

Answer 2

首先，我建议您在不同的移动浏览器上测试您的应用。如果同样的问题，请参见下文：

浏览器与您的应用程序之间的区别可能是因为您在使用setUseWideViewPort WebSetting为true时出错。

检查以下链接：

Answer 3

我遇到了类似的问题，问题是系统字体大小（设置 - ＆gt;显示 - ＆gt;字体大小）会影响WebView中的字体大小，但不影响浏览器中的字体大小。

当我使用cordova时，我使用cordova plugin解决了该问题，请参阅this answer

查看插件代码，它在Android中执行以下操作以重置字体大小：

mWebView.getSettings().setTextZoom(100);

或（ICS前）：

mWebView.getSettings().setTextSize(WebSettings.TextSize.NORMAL);

Answer 4

我在移动设备和应用程序中尝试了http://www.primefaces.org/showcase/mobile/index.xhtml，它们看起来相似

在应用程序中

enter image description here

在Chrome中

enter image description here

我没有看到任何问题。您是否有可能在某些特定的Android版本中获得差异？我在4.4.4验证了它。

Answer 5

要使字体大小与Chrome或网站匹配而不进行任何调整大小，请执行webSettings.setMinimumFontSize(1);

亲切的问候拉敏

WebView中的缩放比例不正确

5 个答案: