Android WebView實踐總結（一）基礎配置基礎操作

摘要： android+html 組合的APP使用越來越廣泛， Webview 也扮演者越來越重要的角色，在此我結合專案實踐對 Webview 的使用進行總結，自己加深記憶的同時也希望可以幫到其他人。 我一步一步來，這篇主要講 基本配置 還有它的 狀態回撥 以及 基本操作 ；為了方便後續擴充...

android+html 組合的APP使用越來越廣泛， Webview 也扮演者越來越重要的角色，在此我結合專案實踐對 Webview 的使用進行總結，自己加深記憶的同時也希望可以幫到其他人。

我一步一步來，這篇主要講 基本配置 還有它的 狀態回撥 以及 基本操作 ；為了方便後續擴充套件，這裡繼承Webview類名為MyWebview，程式碼說明已經在程式碼註釋中體現。

1.標準配置

public class MyWebView extends WebView {

public MyWebView(Context context) {
super(context);
}

public MyWebView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}

public MyWebView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}

private void init() {
WebSettings mSettings = getSettings();
// 支援獲取手勢焦點
requestFocusFromTouch();
setHorizontalFadingEdgeEnabled(true);
setVerticalFadingEdgeEnabled(false);
setVerticalScrollBarEnabled(false);
// 支援JS
mSettings.setJavaScriptEnabled(true);
mSettings.setJavaScriptCanOpenWindowsAutomatically(true);
mSettings.setBuiltInZoomControls(true);
mSettings.setDisplayZoomControls(true);
mSettings.setLoadWithOverviewMode(true);
// 支援外掛
mSettings.setPluginState(WebSettings.PluginState.ON);
mSettings.setRenderPriority(WebSettings.RenderPriority.HIGH);
// 自適應螢幕
mSettings.setUseWideViewPort(true);
mSettings.setLoadWithOverviewMode(true);
// 支援縮放
mSettings.setSupportZoom(false);//就是這個屬性把我搞慘了，
// 隱藏原聲縮放控制元件
mSettings.setDisplayZoomControls(false);
// 支援內容重新佈局
mSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
mSettings.supportMultipleWindows();
mSettings.setSupportMultipleWindows(true);
// 設定快取模式
mSettings.setDomStorageEnabled(true);
mSettings.setDatabaseEnabled(true);
mSettings.setCacheMode(WebSettings.LOAD_DEFAULT);
mSettings.setAppCacheEnabled(true);
mSettings.setAppCachePath(getContext().getCacheDir().getAbsolutePath());
// 設定可訪問檔案
mSettings.setAllowFileAccess(true);
mSettings.setNeedInitialFocus(true);
mSettings.setBlockNetworkImage(false);
// 支援自定載入圖片
if (Build.VERSION.SDK_INT >= 19) {
mSettings.setLoadsImagesAutomatically(true);
} else {
mSettings.setLoadsImagesAutomatically(false);
}
mSettings.setNeedInitialFocus(true);
// 設定編碼格式
mSettings.setDefaultTextEncodingName("UTF-8");
}

}

layout佈局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.allyn.webview.MainActivity">

<android.support.v4.widget.ContentLoadingProgressBar
android:id="@+id/pro_schedule"
android:layout_width="match_parent"
style="@style/Widget.AppCompat.ProgressBar.Horizontal"
android:visibility="visible"
android:max="100"
android:progress="0"
android:layout_height="3dp" />

<com.allyn.webview.MyWebView
android:id="@+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent" />

</LinearLayout>

2.狀態回撥

public class MainActivity extends AppCompatActivity {

private MyWebView mWebview;
private ContentLoadingProgressBar mProSchedule;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

mProSchedule = findViewById(R.id.pro_schedule);
mWebview = findViewById(R.id.webview);
mWebview.loadUrl("http://www.baidu.com");
//幫助WebView處理各種通知、請求事件
mWebview.setWebViewClient(new WebViewClient(){
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
mProSchedule.setVisibility(View.VISIBLE);
//開始
/**
* 網頁重定向時會執行多次
*/
}

@Override
public void onLoadResource(WebView view, String url) {
super.onLoadResource(view, url);
//網頁載入成功
}

@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
//網址處理
/**
* 可對指定網址進行攔截
*/
view.loadUrl(url);
return true;
}

@Override
public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
super.onReceivedError(view, request, error);
//網頁載入失敗
/**
* 此回撥中可進行自定義錯誤頁面，
* 遇到錯誤時示例程式碼:view.loadUrl("file://android_asset/error.html");
*/
}

@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
mProSchedule.setVisibility(View.GONE);
//網頁載入完成
}
});

//輔助WebView處理Javascript的對話方塊，網站圖示，網站title，載入進度等
mWebview.setWebChromeClient(new WebChromeClient(){
@Override
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
//網頁載入進度
if (newProgress<100){
mProSchedule.setProgress(newProgress);
}
}
});
}
}

3.基本控制

//後退
public void clickReturn(View view) {
if (mWebview.canGoBack()) {
mWebview.goBack();
}
}

//前進
public void clickAhead(View view) {
if (mWebview.canGoForward()) {
mWebview.goForward();
}
}

//重新整理
public void clickReload(View view) {
mWebview.reload();
}

//暫停
public void clickStop(View view) {
mWebview.stopLoading();
}

• github Demo原始碼點這裡

基礎功能的實現到這裡就寫完了，