摘要：將的高度設(shè)置成將會(huì)出現(xiàn)如下行為的高度被設(shè)置成了固定值，這意味著相對(duì)于高度的元素大小可能不正確對(duì)于應(yīng)用程序所在設(shè)備是及更早的標(biāo)簽將會(huì)被忽略以保證向后的兼容性不支持使用的布局寬度。

WebView 是一個(gè)顯示網(wǎng)頁內(nèi)容的組件，可以顯示網(wǎng)絡(luò)上的一些在線內(nèi)容并且可以作為 Web 瀏覽器滾動(dòng)顯示的內(nèi)容，它使用 WebKit作為渲染引擎來顯示網(wǎng)頁，里面包括放大、縮小、執(zhí)行文本搜索等進(jìn)行前后導(dǎo)航的方法。

注意 ：如果要在 WebView 中顯示在線網(wǎng)頁等內(nèi)容時(shí)，需要在 AndroidManifest.xml 文件中添加網(wǎng)絡(luò)權(quán)限，參考如下：

默認(rèn)情況下 WebView 不啟用 JavaScript ,網(wǎng)頁錯(cuò)誤也將被忽略，如果僅僅是在 UI 上顯示一段 HTML,這就會(huì)非常好， 用戶在不需要再閱讀之前與用戶交互，網(wǎng)頁不需要與用戶交互 ，如果你需要一個(gè)完整的瀏覽器，你需要調(diào)用相應(yīng)的 Intent 去啟動(dòng)瀏覽器去執(zhí)行某些操作，而不是使用 WebView 來顯示，調(diào)用系統(tǒng)瀏覽器使用如下代碼：

Uri uri = Uri.parse("https://www.example.com");
Intent intent = new Intent(Intent.ACTION_VIEW, uri);
startActivity(intent);
 

使用 WebView 主要有兩種使用方式，在 Activity 等 onCreate() 方法直接創(chuàng)建使用或者在布局文件中引入，參考如下：

WebView webview = new WebView(this);
//這里將整個(gè) Activity 窗口作為 WebView 的顯示界面，也可多帶帶放在某個(gè)布局中
setContentView(webview);

那么，我們?nèi)绾渭虞d一個(gè)網(wǎng)頁呢，如果網(wǎng)頁是本地的又如何加載呢，還有如何加載一段 HTML 的片段呢，常用的加載方法主要有兩個(gè)，如下：

這里測(cè)試使用百度首頁、CSDN首頁、騰訊首頁進(jìn)行測(cè)試，測(cè)試百度首頁時(shí)，需要設(shè)置如下屬性網(wǎng)頁內(nèi)容才能正確顯示，如果不設(shè)置將顯示為白屏：

webSettings.setJavaScriptEnabled(true);
webSettings.setDomStorageEnabled(true);
webView.loadUrl("https://www.baidu.com");

測(cè)試 CSDN 首頁時(shí)，會(huì)提示打開系統(tǒng)帶瀏覽器的應(yīng)用去打開該頁面，設(shè)置如下屬性才能直接加載網(wǎng)頁內(nèi)容：

webView.setWebViewClient(new WebViewClient());
webView.loadUrl("http://blog.csdn.net");

測(cè)試騰訊首頁時(shí)可以直接加載首頁內(nèi)容：

webView.loadUrl("http://www.qq.com");

測(cè)試環(huán)境可能不同，結(jié)果也不相同。

其中加載 SD 卡上的 HTML 文件時(shí)要申請(qǐng)?jiān)L問 SD 卡上的權(quán)限 Manifest.permission.WRITE_EXTERNAL_STORAGE，參考如下：

//加載 assets 目錄下的 HTML 文件
webView.loadUrl("file:///android_asset/mine.html");
//加載 SD 卡上的 HTML 文件
webView.loadUrl("file:///"+Environment.getExternalStorageDirectory().getAbsolutePath()+ File.separator+"mine.html");

加載 HTML 片段時(shí)，要設(shè)置字符集，否則會(huì)出現(xiàn)亂碼，參考如下：

//加載 HTML 片段，設(shè)置字符集防止亂碼出現(xiàn)
webView.loadData(Util.getHtmlData(),"text/html; charset=UTF-8",null);

WebView 的設(shè)置與界面處理主要有以下幾個(gè)方面：

創(chuàng)建并設(shè)置 WebChromeClient，主要是輔助 WebView 來處理 JavaScript 的對(duì)話框、網(wǎng)站標(biāo)題、加載進(jìn)度等；

創(chuàng)建并設(shè)置 WebViewClient, 主要是提供各種事件的回調(diào)等；

通過 WebSetting 對(duì)象可以設(shè)置 WebView 的各種相關(guān)屬性，如支持 JavaScript 、設(shè)置 WebView 緩存、字體大小等；

JS 與 Java 的互相調(diào)用，如使用addJavascriptInterface（Object，String）方法將Java對(duì)象注入WebView。此方法允許您將Java對(duì)象注入到頁面的JavaScript上下文中，以便可以通過頁面中的JavaScript訪問它們。

Android 1.5 之后支持調(diào)用如下方法啟用內(nèi)置縮放：

WebSettings.setBuiltInZoomControls(boolean)

注意：設(shè)置了內(nèi)置縮放，WebView 的寬高又是 wrap_content，將會(huì)導(dǎo)致未定義的行為，使用時(shí)應(yīng)該避免這種情況。

屏幕密度是基于屏幕分辨率的，低密度的屏幕每英寸可用像素更少，高密度的屏幕每英寸可用像素更多，屏幕密度是比較重要的，因?yàn)槠渌蛩叵嗤那闆r下，根據(jù)像素定義的 UI 元素，在低密度屏幕上顯示較大，在較高屏幕密度的屏幕上顯示較??；為了方便 Android 將實(shí)際中的屏幕密度換算成比較廣泛的屏幕密度：高、中和低。

默認(rèn)情況下，WebView 縮放的網(wǎng)頁，使其繪制的尺寸與中密度屏幕上的默認(rèn)外觀相匹配，所以在高密度屏幕上適用于 1.5 倍的縮放（像素較?。?，在低密度屏幕上適用于 0.75 倍的縮放（像素較大）；從 Android 2.0 開始 WebView 支持 DOM、CSS 及 meta 標(biāo)簽，幫助 Web 開發(fā)人員根據(jù)不同的屏幕密度來適配目標(biāo)屏幕。

下面是處理不同屏幕密度的一些說明：

使用 window.devicePixelRatio 屬性指定當(dāng)前設(shè)備的默認(rèn)縮放因子，也指設(shè)備上物理像素和設(shè)備獨(dú)立像素(device-independent pixels (dips))的比例，如果 window.devicePixelRatio 的值為 1 ，則該設(shè)備被認(rèn)為是中密度（mdpi）設(shè)備，并且默認(rèn)縮放不應(yīng)用于網(wǎng)頁，如果 window.devicePixelRatio 值為原來的 1.5 倍 ，則該設(shè)備被認(rèn)為是高密度設(shè)備（hdpi），頁面內(nèi)容縮放為 1.5　倍;如果 window.devicePixelRatio 值為 0.75，則該設(shè)備被認(rèn)為是低密度設(shè)備（ldpi），內(nèi)容縮放為原來的 0.75 倍，用公式表示如下：

window.devicePixelRatio(dpr) = physical pixel / dips(css pixel)}

physical pixel = dips *  density / 160} (Android)

使用 -webkit-device-pixel-ratio CSS 媒體查詢來指定使用此樣式表的屏幕密度，其值應(yīng)該為 0.75 、1 、1.5，分別指明這些樣式表適用于低密度、中密度、高密度的屏幕設(shè)備，如下面的聲明表明 hdpi.css 只適用于屏幕像素密度比例為 1.5 的屏幕設(shè)備，也就是適用于高密度屏幕設(shè)備。

如果在應(yīng)用程序中支持 HTML 視頻，需要啟用硬件加速。

關(guān)于硬件加速請(qǐng)參考：Android硬件加速

為了支持全屏幕，如視頻或其他 HTML 內(nèi)容，需要設(shè)置一個(gè) WebChromeClient 并實(shí)現(xiàn) onShowCustomView(View，WebChromeClient.CustomViewCallback) 和 onHideCustomView() 兩個(gè)方法:

通知應(yīng)用程序當(dāng)前頁面進(jìn)入全屏模式，應(yīng)用程序?qū)⒁匀聊Ｊ桨?Web 內(nèi)容、視頻以及其他 HTML 的內(nèi)容。

/**
 * @param view 顯示的View.
 * @param callback 調(diào)用當(dāng)前頁退出當(dāng)前頁
 * full screen mode.
 */
public void onShowCustomView(View view, WebChromeClient.CustomViewCallback callback) {};

通知應(yīng)用程序當(dāng)前頁面退出全屏模式，應(yīng)用程序必須隱藏自定義的 View。

public void onHideCustomView() {}

如果這兩個(gè)方法中的任何一個(gè)沒有實(shí)現(xiàn)，則對(duì)應(yīng)的頁面的 Web 頁面不能進(jìn)入全屏模式，也可以實(shí)現(xiàn) getVideoLoadingProgressView() 來自定義視頻緩沖時(shí)要顯示的視圖。

 public View getVideoLoadingProgressView() {
        return null;
}

針對(duì) Android N 以及 API level > M 的設(shè)備，地理位置 API 僅僅支持以 HTTPs 的方式，如果應(yīng)用以非 HTTPS 的方式請(qǐng)求地理位置 API onGeolocationPermissionsShowPrompt(String, GeolocationPermissions.Callback) 方法將會(huì)被拒絕調(diào)用。

建議將 WebView 的高度設(shè)置成固定值或者是 MATCH_PARENT 而不建議使用 WRAP_CONTENT ,如果 WebView 的高度使用了 MATCH_PARENT ,它的父布局高度實(shí)用 WRAP_CONTENT 會(huì)導(dǎo)致石梯大小不一致。

將 WebView 的高度設(shè)置成 WRAP_CONTENT 將會(huì)出現(xiàn)如下行為：

HTML 的高度被設(shè)置成了固定值，這意味著相對(duì)于 HTML BODY 高度的元素大小可能不正確；

對(duì)于應(yīng)用程序所在設(shè)備是 Android 4.4 及更早的 SDk, meta 標(biāo)簽將會(huì)被忽略以保證向后的兼容性；

不支持使用 WRAP_CONTENT 的布局寬度。如果使用這樣的寬度，WebView 會(huì)嘗試使用其父布局的寬度。

如果用戶同意，WebView 的一些診斷數(shù)據(jù)將會(huì)以匿名的方式上傳到 Google ,這些數(shù)據(jù)會(huì)幫助 Google 改善 WebView ,每個(gè)已初始化 WebView 的應(yīng)用程序都會(huì)收集這些數(shù)據(jù)，如果想停用該功能需要在清單文件中進(jìn)行如下設(shè)置：

參考鏈接：WebView 官網(wǎng)介紹

如果覺得對(duì)自己有幫助，可以關(guān)注公眾號(hào)：jzman-blog，一起交流學(xué)習(xí)。