0

我需要使用的网页具有 320px 宽的背景，网页上的所有内容都按照相同的宽度进行布局。在屏幕较大的设备上，网页上的所有内容都居中但很小。

我已经尝试了我发现的所有东西，但似乎没有任何效果。我尝试过的事情是

<meta name="viewport" content="width=320" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, target-densitydpi=device-dpi" />

和其他几种组合

webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);

webView.setInitialScale(percent);

我还找到了一个似乎可以解决问题的 Javascript 解决方案，但仅适用于第一个加载的 url。我无法弄清楚它为什么会发生，除了它似乎onPageStarted()并且onPageFinished()在第一页被调用了两次。

这就是我的做法

WebView webView = (WebView) findViewById(R.id.webview);

WindowManager manager = (WindowManager) getSystemService(WINDOW_SERVICE);
final DisplayMetrics metrics = new DisplayMetrics();
manager.getDefaultDisplay().getMetrics(metrics);
metrics.widthPixels /= metrics.density;

webView.setWebViewClient(new WebViewClient() {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        Log.d("url", url);
        view.loadUrl(url);
        return true;
    }

    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        super.onPageStarted(view, url, favicon);
        Log.d("page", "started " + url);
    }

    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
        Log.d("page", "finished " + url);

        view.loadUrl("javascript:var scale = " + metrics.widthPixels +
            " / document.body.scrollWidth; document.body.style.zoom = scale;");
    }
});

WebSettings webSettings = webView.getSettings();
webSettings.setUseWideViewPort(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setJavaScriptEnabled(true);

webView.loadUrl(url);

那么有什么想法吗？

4

2 回答 2

2

在我的情况下..

将此代码放入html..

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no" />

这就是所有的 WebView 设置...

    WebSettings settings = wvContents.getSettings();
    settings.setUseWideViewPort(true);
    settings.setBuiltInZoomControls(true);
    settings.setSupportZoom(true);

    settings.setJavaScriptEnabled(true);
    settings.setLoadWithOverviewMode(true);

就这样！它工作正常。我没有在 onPageStarted() 和 onPageFinished 中做任何事情。试试我的代码并为我们反馈。祝你好运，兄弟！

于 2014-01-03T06:44:25.670 回答
1 
<meta name="viewport" content="width=device-width, user-scalable=no" />

这里 user-scalable= no " 应该是 user-scalable= yes "

于 2017-03-22T05:33:05.720 回答