Android-WebView與本地HTML (HTML調用-->Java的方法)

時間 2019-11-19

標籤 android webview 本地 html 調用 java 方法欄目 Android 简体版

原文原文鏈接

上一篇博客 Android-WebView加載網絡圖片&網頁 介紹了使用WebView去加載網絡上的圖片與網頁;javascript

此篇博客專門介紹 Android-WebView與本地HTML (HTML調用-->Java的方法)，其實對於WebView來講不管是本地HTML 仍是網絡HTML ，代碼操做方式都是類似的，只是loadUrl(1.網絡連接或 2.本地連接)

JavaScript 調用-----> Java的call方法

在 assets目錄中，放入test.html：html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <!-- viewport的寬度等於設備寬度，viewport會根據屏幕寬度自動適應，而且對圖片和文字進行縮放顯示 -->
        <meta name="viewport" content="initial-scale=1.0" />

        <title>Web頁面</title>

        <script type="text/javascript">

            function call(){
                android_my_main_activity3.call('18888888888');
            }

        </script>

    </head>

    <body>

        這是一個html頁面,如今在WebView中運行
        <a href="javascript:call()">打電話給18888888888</a>

    </body>

</html>

Activity：

package cn.h5;

import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.widget.Toast;

public class MainActivity3 extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main3);

        /**
         * 定義此WebView 用於去展示本地HTML
         */
        WebView webView = findViewById(R.id.wv_webview);

        /**
         * WebView默認是不可以執行javascript
         * 如下代碼是設置>>容許webview可以執行javascript代碼
         */
        webView.getSettings().setJavaScriptEnabled(true);

        /**
         * addJavascriptInterface是添加(給js調用-->Java方法)
         * JavaScriptCallbackThisJavaMethod裏面的方法 就是給JavaScript調用的;
         * android_my_main_activity3是JavaScript/HTML/H5那邊定義定義的標識，因此必須和JavaScript/HTML/H5那邊定義標識一致
         *
         * 如下是 JavaScript代碼，因此必須是 android_my_main_activity3
         *  function call(){
         *    android_my_main_activity3.call('18888888888');
         *  }
         */
        webView.addJavascriptInterface(new JavaScriptCallbackThisJavaMethod(), "android_my_main_activity3");

        /**
         * 加載本地的HTML文件
         */
        webView.loadUrl("file:///android_asset/test.html");
    }

    /**
     * 此JavaScriptCallbackThisJavaMethod類名是隨意取得
     * 也能夠取名Wie JavaScriptCallbackJava
     *              JavaScriptToJava
     *              ......
     */
    private class JavaScriptCallbackThisJavaMethod {

        /**
         * 如下是 JavaScript代碼，因此必須方法名與方法參數 必須是 void call(int類型的一個參數)
         *  function call(){
         *    android_my_main_activity3.call('18888888888');
         *  }
         */
        @JavascriptInterface
        public void call(String phoneNumber) {
            Toast.makeText(MainActivity3.this, "Android原生去打電話", Toast.LENGTH_SHORT).show();

            // 隱士意圖 激活系統組件打電話操做
            Intent intentCall = new Intent();
            intentCall.setAction(Intent.ACTION_CALL);
            intentCall.setData(Uri.parse("tel:" + phoneNumber));
            MainActivity3.this.startActivity(intentCall);
        }
    }
}

Activity的佈局：

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

    <!--
        定義WebView
            1.WebView能夠展示處理本地的HTML相關;
            2.WebView能夠展示處理網絡的HTML相關;
            3.WebView能夠製做自定義瀏覽器;
            ....
     -->
    <WebView
        android:id="@+id/wv_webview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    </WebView>


</LinearLayout>

AndroidManifest.xml中添加權限：

　　 <!-- 撥打電話的權限 -->
    <uses-permission android:name="android.permission.CALL_PHONE" />

執行結果：

相關標籤/搜索

本地方法調用

html&html

html

html+css+javascript+html

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。