• 【Android进阶】Android程序与JavaScript之间的简单调用

    本篇将讲解一个简单的Android与JavaScript之间的简单调用的小程序

    效果图


     

    工程结构


     

    HTMLActivity.java代码 

    1. package com.example.javatojs;  
    2.   
    3.   
    4. import android.app.Activity;  
    5. import android.os.Bundle;  
    6. import android.os.Handler;  
    7. import android.webkit.WebView;  
    8.   
    9. public class HTMLActivity extends Activity {  
    10.     private WebView webView = null;  
    11.     public Handler handler = new Handler();  
    12.     @Override  
    13.     public void onCreate(Bundle savedInstanceState) {  
    14.         super.onCreate(savedInstanceState);  
    15.         setContentView(R.layout.activity_main);  
    16.           
    17.         webView = (WebView)this.findViewById(R.id.webView);  
    18.         //设置字符集编码  
    19.         webView.getSettings().setDefaultTextEncodingName("UTF-8");  
    20.         //开启JavaScript支持  
    21.         webView.getSettings().setJavaScriptEnabled(true);  
    22.         //传递一个Java对象，同时给他命名，这个对象可以在js中调用这个对象的方法  
    23.         webView.addJavascriptInterface(new MyObject(this,handler), "myObject");  
    24.         //加载assets目录下的文件  
    25.         String url = "file:///android_asset/index.html";  
    26.         webView.loadUrl(url);  
    27.     }  
    28. }  



    MyObject.java 

    1. package com.example.javatojs;  
    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方法的执行在handler绑定的Activity的主线程中  
    21.         handler.post(new Runnable() {  
    22.   
    23.             public void run() {  
    24.                 // 调用客户端setContactInfo方法  
    25.                 webView.loadUrl("javascript:setContactInfo('" + getJsonStr()  
    26.                         + "')");  
    27.             }  
    28.         });  
    29.     }  
    30.   
    31.     public static String getJsonStr() {  
    32.         try {  
    33.             JSONObject object1 = new JSONObject();  
    34.             object1.put("id", 1);  
    35.             object1.put("name", "张三");  
    36.             object1.put("phone", "123456");  
    37.   
    38.             JSONObject object2 = new JSONObject();  
    39.             object2.put("id", 2);  
    40.             object2.put("name", "李四");  
    41.             object2.put("phone", "456789");  
    42.   
    43.             JSONArray jsonArray = new JSONArray();  
    44.             jsonArray.put(object1);  
    45.             jsonArray.put(object2);  
    46.             return jsonArray.toString();  
    47.         } catch (JSONException e) {  
    48.             e.printStackTrace();  
    49.         }  
    50.         return null;  
    51.     }  
    52. }  


    activity_main.java

      

    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    3.     android:layout_width="fill_parent"  
    4.     android:layout_height="fill_parent"  
    5.     android:orientation="vertical" >  
    6.   
    7.     <WebView  
    8.         android:id="@+id/webView"  
    9.         android:layout_width="fill_parent"  
    10.         android:layout_height="fill_parent" />  
    11.   
    12. </LinearLayout>  



    index.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.         var tableObj = document.getElementById("contact");  
    10.         //通过eval方法处理得到json对象数组  
    11.         var jsonObjects = eval(data);  
    12.         for (var i = 0; i < jsonObjects.length; i++) {  
    13.             //获取json对象  
    14.             var jsonObj = jsonObjects[i];  
    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. </script>  
    27. </head>  
    28. <!--调用服务器端init方法-->  
    29. <body onload="javascript:myObject.init()">  
    30.     <table id="contact">  
    31.         <tr>  
    32.             <td>编号</td>  
    33.             <td>姓名</td>  
    34.             <td>电话</td>  
    35.         </tr>  
    36.     </table>  
    37. </body>  
    38. </html>  


    源代码下载

    如有疑问，可留言
  • 相关阅读:
    中国SNS用户体验设计分析和互动性浅析
    jQuery的运行机制和设计理念
    Web前端工程师如何给自己定位？
    用户体验这点事儿
    css selection改变文字反选的背景颜色
    HTTP 状态代码
    [翻译]导致网站可用性差的十个最常见问题
    前端开发中的一些用户体验细节
    SQL的行转列问题
    ASP.NET动态添加文本框参考做法
  • 原文地址：https://www.cnblogs.com/android100/p/android-js.html
Copyright © 2020-2023  润新知