【Android】如何讓WebView大小自動擴展為內容的大小

WebViewClient的「onPageFinished」被呼叫執行時，就表示網頁已經有一個初步的大小可供計算。但從Java端並無法去取得這個到小，只有網頁本身可以知道自己的大小，所以我們必須要使用JavaScriptInterface去取得這個大小。

在「onPgaeFinished」內執行一段JavaScript：「"javascript:MyApp.resize(document.body.getBoundingClientRect().height)"」，功能大概是說「執行resize這個函數，並將網頁body的高度傳入。」

所以接著要設計一個名稱為「resize」的函數並掛上「@JavascriptInterface」。

函數的內容基本上是重新設定整個WebView的LayoutParams，尤其是寬高。

高度的算法大概是「height * getResources().getDisplayMetrics().density」，「height」大概就是在JavaScript中傳入「resize」函數的數值。因為網頁有自己的高度單位，所以要換算成density才能取得正確大小。


注意！要記得執行addJavascriptInterface這個功能。這是讓網頁內容可以取得加註了「@JavascriptInterface」函數的必要辦法。（記得「javascript」中的「MyApp」和這裡的「MyApp」是連動的，如果要修改或自訂，記得一起完成。）


以下是更完整的程式碼。

private void setupWebView() {
    webView.getSettings().setJavaScriptEnabled(true);
    webView.setWebViewClient(new WebViewClient() {
        @Override
        public void onPageFinished(WebView view, String url) {
            webView.loadUrl("javascript:MyApp.resize(document.body.getBoundingClientRect().height)");
            super.onPageFinished(view, url);
        }
    });
    webView.addJavascriptInterface(this, "MyApp");
}

@JavascriptInterface
public void resize(final float height) {
    MyActivity.this.runOnUiThread(new Runnable() {
        @Override
        public void run() {
            webView.setLayoutParams(new LinearLayout.LayoutParams(getResources().getDisplayMetrics().widthPixels, (int) (height * getResources().getDisplayMetrics().density)));
        }
    });
}