本篇将讲解一个简单的Android与JavaScript之间的简单调用的小程序
效果图
工程结构
HTMLActivity.java代码
- package com.example.javatojs;
- import android.app.Activity;
- import android.os.Bundle;
- import android.os.Handler;
- import android.webkit.WebView;
- public class HTMLActivity extends Activity {
- private WebView webView = null;
- public Handler handler = new Handler();
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.activity_main);
- webView = (WebView)this.findViewById(R.id.webView);
- //设置字符集编码
- webView.getSettings().setDefaultTextEncodingName("UTF-8");
- //开启JavaScript支持
- webView.getSettings().setJavaScriptEnabled(true);
- //传递一个Java对象,同时给他命名,这个对象可以在js中调用这个对象的方法
- webView.addJavascriptInterface(new MyObject(this,handler), "myObject");
- //加载assets目录下的文件
- String url = "file:///android_asset/index.html";
- webView.loadUrl(url);
- }
- }
MyObject.java
- package com.example.javatojs;
- import org.json.JSONArray;
- import org.json.JSONException;
- import org.json.JSONObject;
- import android.os.Handler;
- import android.webkit.WebView;
- public class MyObject {
- private Handler handler = null;
- private WebView webView = null;
- public MyObject(HTMLActivity htmlActivity, Handler handler) {
- this.webView = (WebView) htmlActivity.findViewById(R.id.webView);
- this.handler = handler;
- }
- public void init() {
- // 通过handler来确保init方法的执行在handler绑定的Activity的主线程中
- handler.post(new Runnable() {
- public void run() {
- // 调用客户端setContactInfo方法
- webView.loadUrl("javascript:setContactInfo(‘" + getJsonStr()
- + "‘)");
- }
- });
- }
- public static String getJsonStr() {
- try {
- JSONObject object1 = new JSONObject();
- object1.put("id", 1);
- object1.put("name", "张三");
- object1.put("phone", "123456");
- JSONObject object2 = new JSONObject();
- object2.put("id", 2);
- object2.put("name", "李四");
- object2.put("phone", "456789");
- JSONArray jsonArray = new JSONArray();
- jsonArray.put(object1);
- jsonArray.put(object2);
- return jsonArray.toString();
- } catch (JSONException e) {
- e.printStackTrace();
- }
- return null;
- }
- }
activity_main.java
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:orientation="vertical" >
- <WebView
- android:id="@+id/webView"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent" />
- </LinearLayout>
index.html
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <title></title>
- <script type="text/javascript">
- //data数据类型为字符串,字符串里面是数组,每一个数组元素为一个json对象,例如"[{id:1,name:‘张三‘,phone:‘135656461‘},{id:2,name:‘李四‘,phone:‘1896561‘}]"
- function setContactInfo(data) {
- var tableObj = document.getElementById("contact");
- //通过eval方法处理得到json对象数组
- var jsonObjects = eval(data);
- for (var i = 0; i < jsonObjects.length; i++) {
- //获取json对象
- var jsonObj = jsonObjects[i];
- var tr = tableObj.insertRow(tableObj.rows.length); //添加一行
- //添加三列
- var td1 = tr.insertCell(0);
- var td2 = tr.insertCell(1);
- var td3 = tr.insertCell(2);
- td1.innerHTML = jsonObj.id;
- td2.innerHTML = jsonObj.name;
- td3.innerHTML = jsonObj.phone;
- }
- }
- </script>
- </head>
- <!--调用服务器端init方法-->
- <body onload="javascript:myObject.init()">
- <table id="contact">
- <tr>
- <td>编号</td>
- <td>姓名</td>
- <td>电话</td>
- </tr>
- </table>
- </body>
- </html>
如有疑问,可留言