现在的位置: 首页 > 综合 > 正文

android js双向调用

2013年09月20日 ⁄ 综合 ⁄ 共 4433字 ⁄ 字号 小 中 大 ⁄ 评论关闭

转：http://liaokang-java.iteye.com/blog/1168832

Android手机中内置了一款高性能webkit内核，该内核完美封装到了WebView组件中，而从js中直接调用java方法和在java中直接调用js方法更是让我们看到了WebView的强大，下面这个小例子介绍了怎样在js和java中双向调用方法

1.首先是布局文件main.xml

Xml代码  收藏代码
  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="fill_parent"  
  10.     android:id="@+id/webView"  
  11.     />  
  12. </LinearLayout>  

2.在assets目录下新建一个index.html文件

Html代码  收藏代码
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  
  2.         "http://www.w3.org/TR/html4/loose.dtd">  
  3. <html>  
  4. <head>  
  5.   <title></title>  
  6.     <script type="text/javascript">  
  7.         //data数据类型为字符串，字符串里面是数组，每一个数组元素为一个json对象，例如"[{id:1,name:'张三',phone:'135656461'},{id:2,name:'李四',phone:'1896561'}]"  
  8.         function setContactInfo(data)  
  9.         {  
  10.             var tableObj = document.getElementById("contact");  
  11.             var jsonObjects = eval(data);   //通过eval方法处理得到json对象数组  
  12.             for(var i=0; i<jsonObjects.length; i++)  
  13.             {  
  14.                    var jsonObj = jsonObjects[i];    //获取json对象  
  15.                    var tr = tableObj.insertRow(tableObj.rows.length);   //添加一行  
  16.                    //添加三列  
  17.                    var td1 = tr.insertCell(0);  
  18.                    var td2 = tr.insertCell(1);  
  19.                    var td3 = tr.insertCell(2);  
  20.                      
  21.                    td1.innerHTML = jsonObj.id;  
  22.                    td2.innerHTML = jsonObj.name;  
  23.                    td3.innerHTML = jsonObj.phone;  
  24.             }  
  25.         }  
  26.   
  27.     </script>  
  28. </head>  
  29. <!--onload="javascript:myObject.init()调用服务器端init方法-->  
  30. <body onload="javascript:myObject.init()">  
  31.       <table id="contact">  
  32.           <tr>  
  33.               <td>编号</td>  
  34.               <td>姓名</td>  
  35.               <td>电话</td>  
  36.           </tr>  
  37.       </table>  
  38. </body>  
  39. </html>  

3.接着是Activity

Java代码  收藏代码
  1. package com.lamp.activity;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.os.Handler;  
  6. import android.webkit.WebView;  
  7.   
  8. public class HTMLActivity extends Activity {  
  9.     private WebView webView = null;  
  10.     public Handler handler = new Handler();  
  11.     @Override  
  12.     public void onCreate(Bundle savedInstanceState) {  
  13.         super.onCreate(savedInstanceState);  
  14.         setContentView(R.layout.main);  
  15.           
  16.         webView = (WebView)this.findViewById(R.id.webView);  
  17.         //设置字符集编码  
  18.         webView.getSettings().setDefaultTextEncodingName("UTF-8");  
  19.         //开启JavaScript支持  
  20.         webView.getSettings().setJavaScriptEnabled(true);  
  21.         webView.addJavascriptInterface(new MyObject(this,handler), "myObject");  
  22.         //加载assets目录下的文件  
  23.         String url = "file:///android_asset/index.html";  
  24.         webView.loadUrl(url);  
  25.     }  
  26. }  

4.然后是绑定js的类MyObject

Java代码  收藏代码
  1. package com.lamp.activity;  
  2.   
  3. import org.json.JSONArray;  
  4. import org.json.JSONException;  
  5. import org.json.JSONObject;  
  6.   
  7. import android.os.Handler;  
  8. import android.webkit.WebView;  
  9.   
  10. public class MyObject {  
  11.     private Handler handler = null;  
  12.     private WebView webView = null;  
  13.   
  14.     public MyObject(HTMLActivity htmlActivity, Handler handler) {  
  15.         this.webView = (WebView)htmlActivity.findViewById(R.id.webView);  
  16.         this.handler = handler;  
  17.     }  
  18.       
  19.     public void init(){  
  20.         //通过handler来确保init方法的执行在主线程中  
  21.         handler.post(new Runnable() {  
  22.               
  23.             public void run() {  
  24.                 //调用客户端setContactInfo方法  
  25.                 webView.loadUrl("javascript:setContactInfo('" + getJsonStr() + "')");  
  26.             }  
  27.         });  
  28.     }  
  29.       
  30.     public static String getJsonStr(){  
  31.         try {  
  32.             JSONObject object1 = new JSONObject();  
  33.             object1.put("id", 1);  
  34.             object1.put("name", "张三");  
  35.             object1.put("phone", "123456");  
  36.               
  37.             JSONObject object2 = new JSONObject();  
  38.             object2.put("id", 2);  
  39.             object2.put("name", "李四");  
  40.             object2.put("phone", "456789");  
  41.               
  42.             JSONArray jsonArray = new JSONArray();  
  43.             jsonArray.put(object1);  
  44.             jsonArray.put(object2);  
  45.             return jsonArray.toString();  
  46.         } catch (JSONException e) {  
  47.             e.printStackTrace();  
  48.         }  
  49.         return null;  
  50.     }  
  51. }  

运行项目，我们可以看到两位联系人的信息显示在了屏幕上

返回
【上篇】
【下篇】

作者:

抱歉!评论已关闭.

返回首页

Copyright © 2013-2018 学步园  保留所有权利.
软文销售 QQ客服：2265327166 点击这里给我发消息（其他合作也可洽谈）
必威体育
必威电竞