Question

我需要使用的网页背景宽度为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);

所有想法？

Answer 1

就我而言..

将此代码放入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中没有做任何事情。试试我的代码并反馈给我们。祝你好运！

Answer 2

<meta name="viewport" content="width=device-width, user-scalable=no" />

此处用户可扩展= 否“应该是用户可扩展的= 是”

放大WebView以适应网页的宽度

2 个答案: