一、WebView是什么？

WebView是android中一個非常重要的控制元件，它的作用是用來展示一個web頁面，

二、WebView的作用

（1）顯示和渲染網頁；
（2）可與頁面JavaScript互動，實作混合開發，

三、使用步驟

1.使用WebView之前，需在AndroidManifest.xml檔案中宣告訪問網路權限

  <uses-permission android:name="android.permission.INTERNET" />

2.加載頁面的方式

加載頁面一般有以下兩種形式：


    //方式一：加載一個網頁
   webView.loadUrl("http://www.baidu.com");
   
    //方式二：加載應用資源檔案內的網頁
   webView.loadUrl("file:///android_asset/test.html");

四、示范程式

（1）使用WebView加載本地檔案

A:新建一個本地test.html檔案

創建步驟：

a:創建assets檔案夾
在這里插入圖片描述
b：在生成的assets檔案夾下創建test.xml檔案

<html>
<title>本地HTML</title>
<script>
    function changetxt(val){
        document.getElementById("txt").innerHTML=val;
    }
</script>
<body>Hello World</body><p id="txt"></p>
</html>

B:在專案的布局檔案中填入WebView

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="15dp">

    <WebView
        android:id="@+id/wb"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

效果圖：
在這里插入圖片描述
C:在Java代碼中填寫

package com.example.upclass;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebView;
public class MainActivity_10_19 extends AppCompatActivity {

    private WebView webView;
   @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main_10_19);
        
        webView = findViewById(R.id.wb);
           //要支持JS，否則一些網頁不能正常加載
        webView.getSettings().setJavaScriptEnabled(true);
           //加載本地HTML 檔案路徑是固定的
        webView.loadUrl("file:///android_asset/test.html");
        }
  }

運行效果圖：
在這里插入圖片描述

（2）使用WebView加載網頁檔案

A：將加載本地檔案的陳述句改為以下即可

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

注意：
如果直接用上面的陳述句來加載網頁，很有可能會彈出系統瀏覽器進行網頁訪問，這樣使用體驗就會很差！解決辦法是在loadUrl()之前加上這樣一句代碼：

//這樣寫就繼續在WebView中繼續打開鏈接
webView.setWebViewClient(new WebViewClient());

完整代碼：

public class MainActivity_10_19 extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main_10_19);
        WebView webView = (WebView)findViewById(R.id.wb);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.setWebViewClient(new WebViewClient());
        webView.loadUrl("http://www.baidu.com");
    }
}

（3）WebView的兩個常用方法

webView.setWebViewClient(new WebViewClient())；

webView.setWebChromeClient(new WebChromeClient())；

webView.setWebViewClient(new WebViewClient())；
作用：是當從一個網頁跳轉到另外一個網頁時，我們希望目標網頁仍然在當前的webview中顯示，而不是在瀏覽器中打開 //如果沒有webView.setWebViewClient(new WebViewClient());這句，該網頁會在手機自帶的瀏覽器中打開，

webView.setWebChromeClient(new WebChromeClient())；
作用：用來設定更加豐富的處理效果，比如JS、進度條等

實體：

 webView.setWebViewClient(new WebViewClient() {
    		   //當頁面開始加載
            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                super.onPageStarted(view, url, favicon);
                Log.d("WebView", "onPageStarted...");
            }
			  //當頁面完成加載
            @Override
            public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
                Log.d("WebView", "onPageFinished...");
                /*  這兩條陳述句可以設定一個當頁面加載完成時，彈出一個框
                	小廣告就是這樣來的
                webView.loadUrl("javascript:alert('hello')");
            	webView.evaluateJavascript("javascript:alert('hello')", null);
            	*/
            }
        });

小廣告圖示：
在這里插入圖片描述

     webView.setWebChromeClient(new WebChromeClient() {
     			 //監聽到進度 可以用于設定一個進度條
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                super.onProgressChanged(view, newProgress);
                Log.d("MainActivity", String.valueOf(newProgress));
            }
			  //可以獲取網頁的標題
            @Override
            public void onReceivedTitle(WebView view, String title) {
                super.onReceivedTitle(view, title);
                 setTitle(title);
            }
        });