android使用html+javascript来制作页面
WebView.addJavascriptInterface(Object obj, String interfaceName)
其中obj是我们自己用来实现功能的一个类，interfaceName是一个对象的名称，就是obj这个对象的名称。
这样说可能有点抽象，但是看一个例子就会明白。
既然是html,那肯定就要有一个HTML文件，文件名为main.html，放置在android工程的assets文件夹下，如果没有这个文件夹，可以在根目录创建一个。
1 <html>
2 <script language="javascript">
3 /* This function is invoked by the activity */
4 /* 这个函数被Activity调用的活动 这里的图片我们可以在它的连接里面下载 android_waving.png */
5 function wave() {
6 /* 这里是一个javascript 自定义函数，这是由我们在android的程序里调用的，不在在HTML中调用*/
7 document.getElementById("droid").src="ic_launcher.png";
8 }
9 function hellow(){
10 alert('hellow world');
11 document.getElementById("droid").src="ic_launcher.png";
12 }
13 </script>
14 <body>
15 <!-- Calls into the javascript interface for the activity -->
16 <!-- 从HTML文件中调用activity中的函数 -->
17 <!-- 也就是从HTML到android程序 留意window.demo.clickOnAndroid()这句话 -->
18 <a onClick="window.asdasd.clickOnAndroid()">
19 <div style="width:80px;
20 margin:0px auto;
21 padding:10px;
22 text-align:center;
23 border:2px solid #202020;">
24 <!-- 图片默认的为 android_normal.png -->
25 <img id="droid" src="android_normal.png"/><br>
26 Click me!
27 </div>
28 </a>
29 <br>
30 <button onclick="window.my.show()">click</button>
31 </body>
32 </html>Activity文件
1 package com.example.untitled;
2
3 import android.app.Activity;
4 import android.os.Bundle;
5 import android.os.Handler;
6 import android.util.Log;
7 import android.webkit.JsResult;
8 import android.webkit.WebChromeClient;
9 import android.webkit.WebSettings;
10 import android.webkit.WebView;
11 import android.widget.Toast;
12
13 public class MyActivity extends Activity {
14 /**
15 * Called when the activity is first created.
16 */
17 // @Override
18 // public void onCreate(Bundle savedInstanceState) {
19 // super.onCreate(savedInstanceState);
20 // setContentView(R.layout.main);
21 // }
22 private static final String LOG_TAG = "WebViewDemo";
23 private WebView mWebView;
24 private Handler mHandler = new Handler();
25 @Override
26 public void onCreate(Bundle icicle) {
27 super.onCreate(icicle);
28 setContentView(R.layout.main);
29 Toast.makeText(MyActivity.this,"HELLOW WORLD", Toast.LENGTH_LONG);
30
31 mWebView = (WebView) findViewById(R.id.webView);
32
33
34 WebSettings webSettings = mWebView.getSettings();
35 webSettings.setSavePassword(false);
36 webSettings.setSaveFormData(false);
37 // 下面的一句话是必须的，必须要打开javaScript不然所做一切都是徒劳的
38 webSettings.setJavaScriptEnabled(true);
39 webSettings.setSupportZoom(false);
40
41
42 mWebView.setWebChromeClient(new MyWebChromeClient());
43
44 // 看这里用到了 addJavascriptInterface 这就是我们的重点中的重点
45 // 我们再看他的DemoJavaScriptInterface这个类。还要这个类一定要在主线程中
46 mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "asdasd");
47 mWebView.addJavascriptInterface(new myHellowWorld(),"my");
48
49 mWebView.loadUrl("file:///android_asset/main.html");
50 }
51
52 class myHellowWorld{
53 myHellowWorld(){
54
55 }
56 public void show(){
57 mHandler.post(new Runnable(){
58
59 @Override
60 public void run() {
61 Toast.makeText(MyActivity.this,"HELLOW WORLD", Toast.LENGTH_LONG).show();
62 }
63 });
64 }
65 }
66 // 这是他定义由 addJavascriptInterface 提供的一个Object
67 final class DemoJavaScriptInterface {
68 DemoJavaScriptInterface() {
69 }
70
71 /**
72 * This is not called on the UI thread. Post a runnable to invoke
73 * 这不是呼吁界面线程。发表一个运行调用
74 * loadUrl on the UI thread.
75 * loadUrl在UI线程。
76 */
77 public void clickOnAndroid() { // 注意这里的名称。它为clickOnAndroid(),注意，注意，严重注意
78 mHandler.post(new Runnable() {
79 public void run() {
80 // 此处调用 HTML 中的javaScript 函数
81 mWebView.loadUrl("wave()");
82 }
83 });
84 }
85 }
86 // 线下的代码可以不看，调试用的
87 ///////////////////////////////////////////////////////////////////////////////////////////////////
88 /**
89 * Provides a hook for calling "alert" from javascript. Useful for
90 * 从javascript中提供了一个叫“提示框” 。这是很有用的
91 * debugging your javascript.
92 * 调试你的javascript。
93 */
94 final class MyWebChromeClient extends WebChromeClient {
95 @Override
96 public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
97 Log.d(LOG_TAG, message);
98 result.confirm();
99 return true;
100 }
101 }
102
103 }XML的配置很简单，里面就放一个webView就可以了
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 android:orientation="vertical" 4 android:layout_width="fill_parent" 5 android:layout_height="fill_parent" 6 > 7 <WebView 8 android:layout_width="fill_parent" 9 android:layout_height="match_parent" 10 android:id="@+id/webView"/> 11 </LinearLayout>
首先，我们看下代码，需要打开浏览器对JS的支持
webSettings.setJavaScriptEnabled(true);
没有这句，任何JS都执行不了，也就没有意义了。
mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "asdasd");
上面这句就是我们的重点了
这是说创建了一个DemoJavaScriptInterface的对像，名字是asdasd。主意html中的18行，<a onClick="window.asdasd.clickOnAndroid()">，就是说调用了一个asdasd的clickOnAndroid方法。
而这个里面是不能进行UI操作的，所以需要用一个handle和一个线程来调用wave()，也就是JS中的WAVE函数
1 mHandler.post(new Runnable() {
2 public void run() {
3 // 此处调用 HTML 中的javaScript 函数
4 mWebView.loadUrl("wave()");
5 }
6 });
当然也不可以不调用JS，调用java代码也是可以的比如说myHellowWorld中的show函数。
当然最后一句也不可少
mWebView.loadUrl("file:///android_asset/main.html");这就是让浏览器去调用我们的HTML文件。