在某些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文件。
輸入以下代碼:
[html] view plain copy
- <?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”文件。
然後輸入以下代碼:
[java] view plain copy
- 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文件。
使用記事本輸入以下代碼:
[html] view plain copy
- <!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”默認生成文件。
四、運行結果