文章目錄
一、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);
}
});
五、總結
碼農不易，看完啦，點個贊再走吧！
