第100章、WebView应用之Javascript调用Android（从零开始学Android）

最新推荐文章于 2024-07-30 16:51:03 发布

蒋会全

最新推荐文章于 2024-07-30 16:51:03 发布

阅读量3.8k

点赞数

分类专栏： Android 从零开始学Android 文章标签： Android WebView Javascript调用Android

本文链接：https://blog.csdn.net/jianghuiquan/article/details/8686094

版权

Android 同时被 2 个专栏收录

109 篇文章 20 订阅

订阅专栏

从零开始学Android

105 篇文章 483 订阅

订阅专栏

　　在某些Android应用中，使用Javascript调用Android中的方法也是会用到的。

　　（1）用WebView来显示HTML代码；
　　（2）允许WebView执行JavaScript
webView.getSettings().setJavaScriptEnabled(true);

　　（3）获取到HTML文件，也可从网络中获取
webView.loadUrl("file:///android_asset/index.html"); （注意：index.html文件要存放在assets文件夹中）

　　（4）添加一个对象, 让JS可以访问该对象的方法, 该对象中也可以调用JS中的方法.
webView.addJavascriptInterface(new Calculate(), "cal");

　一、设计界面

　　1、布局文件
　　新建res/layout/activity_main.xml文件。
　　输入以下代码：

<?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 
		android:id="@+id/webview" 
		android:layout_width="match_parent" 
		android:layout_height="match_parent" />

</LinearLayout>

二、程序文件

　　1、打开“src/com.genwoxue.webviewjsandroid/MainActivity.java”文件。
　　然后输入以下代码：

package com.genwoxue.webviewjsandroid;

import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;

public class MainActivity extends Activity {
    private WebView webView;

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //实例化WebView
        webView = (WebView) findViewById(R.id.webview);
        //允许JavaScript执行
        webView.getSettings().setJavaScriptEnabled(true);
        //加载HTML文件：注意存放到至assets文件夹，你也可以放到互联网。
        webView.loadUrl("file:///android_asset/index.html");
        //添加一个对象, 让JS可以访问该对象的方法, 该对象中可以调用JS中的方法
        webView.addJavascriptInterface(new Calculate(), "cal");
    }

    private final class Calculate {
        public int power() {
        	return 9*9;
        }

    }
}

　　2、新建assets/index.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">
 
      <title>Calculate</title>
      
  </head>

  <script language="JavaScript">
     function show(){
      	document.getElementById("message").innerText=window.cal.power();
     }
  </script> 

  <body onLoad="show()">
 
	 <span id="message"></span>

  </body>


</html>

　　注意存放位置。

三、配置文件

　　采用“AndroidManifest.xml”默认生成文件。

四、运行结果