JavaScript与Android之间的交互

最新推荐文章于 2023-03-01 14:27:45 发布

张小贝_

最新推荐文章于 2023-03-01 14:27:45 发布

阅读量341

点赞数

分类专栏： android

android 专栏收录该内容

101 篇文章 1 订阅

订阅专栏

http://blog.csdn.net/cai1213/article/details/7951370

JavaScript直接调用Android中的方法，例子：webview直接加载html，html中的javascript调用android端的方法。此例子可以有助于android开发者开发图表类的项目，图表不需要原生代码，只需用脚本实现。图表的脚本生成可以参考：http://www.ichartjs.cn

Android端：

RIAExample.class

[java]view plaincopy 
   
 package com.example;  
   
 import org.json.JSONArray;  
 import org.json.JSONException;  
 import org.json.JSONObject;  
   
 import android.app.Activity;  
 import android.os.Bundle;  
 import android.util.Log;  
 import android.webkit.WebView;  
   
 public class RIAExample extends Activity{  
       
     private WebView web;  
     /** Called when the activity is first created. */  
     @Override  
     public void onCreate(Bundle savedInstanceState) {  
         super.onCreate(savedInstanceState);  
         setContentView(R.layout.main);  
           
         web = (WebView)this.findViewById(R.id.web);  
           
         web.getSettings().setJavaScriptEnabled(true);  
         web.getSettings().setBuiltInZoomControls(true);  
           
         web.addJavascriptInterface(this,"phone");  //通过“phone”与javascript交互；  
           
         web.loadUrl("file:///android_asset/form.html");  
     }  
       
     public String getData(){  
         return "[{name : 'IE',value : 35.75,color:'#9d4a4a'},{name : 'Chrome',value : 29.84,color:'#5d7f97'},{name : 'Firefox',value : 24.88,color:'#97b3bc'},{name : 'Safari',value : 6.77,color:'#a5aaaa'},{name : 'Opera',value : 2.02,color:'#778088'},{name : 'Other',value : 0.73,color:'#6f83a5'}]";  
     }  
       
     public JSONArray getJsonArray(){  
         try {  
             JSONArray data = new JSONArray();  
             JSONObject temp = new JSONObject();  
             temp.put("name", "other");  
             temp.put("value", 0.73);  
             temp.put("color", "#6f83a5");  
             data.put(temp);  
             JSONObject temp1 = new JSONObject();  
             temp1.put("name", "IE");  
             temp1.put("value", 35.75);  
             temp1.put("color", "#a5c2d5");  
             data.put(temp1);  
             JSONObject temp2 = new JSONObject();  
             temp2.put("name", "Chrome");  
             temp2.put("value", 29.84);  
             temp2.put("color", "#cbab4f");  
             data.put(temp2);  
             JSONObject temp3 = new JSONObject();  
             temp3.put("name", "Firefox");  
             temp3.put("value", 24.88);  
             temp3.put("color", "#76a871");  
             data.put(temp3);  
             JSONObject temp4 = new JSONObject();  
             temp4.put("name", "Safari");  
             temp4.put("value", 6.77);  
             temp4.put("color", "#9f7961");  
             data.put(temp4);  
             JSONObject temp5 = new JSONObject();  
             temp5.put("name", "Opera");  
             temp5.put("value", 2.02);  
             temp5.put("color", "#a55f8f");  
             data.put(temp5);  
             System.out.println(data.toString());  
             return data;  
         } catch (JSONException e) {  
             // TODO: handle exception  
             Log.e("TAG", "JSONException!!!");  
             return null;  
         }  
           
     }  
       
     public String getParams(){  
         return "{render : 'canvasDiv',data: data,title : '2012',legend : {enable : true},animation:true,showpercent:true,decimalsnum:2,width : 640,height : 480,radius:140}";  
     }  
       
     public String getType(){  
         return "new iChart.Pie2D(params)";  
     }  
       
       
     public void debugout(String info){  
         Log.i("ss",info);  
         System.out.println(info);  
     }  
     
 }  

assets文件夹：

html源码：

[html]view plaincopy 
   
 <!DOCTYPE html>  
 <html>  
     <head>  
         <meta charset="UTF-8" />  
         <title>ichartjs例子</title>  
         <script type="text/javascript" src="js/ichart-1.0.min.js"></script>  
       
         <script type="text/javascript">  
             window.onload = function(){  
                 window.phone.debugout("inside js onload");  
                   
                 $(function(){  
                     window.phone.debugout("----------in iChart.Pie2D function-------");  
                     var data_string = window.phone.getData();  
                     eval("var data =" + data_string);  
                       
                     var params_string = window.phone.getParams();  
                     eval("var params =" + params_string);  
                       
                     var type_string = window.phone.getType();  
                     eval("var chart =" + type_string);  
                       
                     chart.draw();  
                     window.phone.debugout("----------in iChart.Pie2D function, after draw()-------");  
                 });  
                   
             };  
         </script>   
           
         </head>  
         <body>  
             <div id='canvasDiv'></div>  
         </body>     
 </html>  

效果图：

张小贝_

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript与Android之间的交互

http://blog.csdn.net/cai1213/article/details/7951370JavaScript直接调用Android中的方法，例子：webview直接加载html，html中的javascript调用android端的方法。此例子可以有助于android开发者开发图表类的项目，图表不需要原生代码，只需用脚本实现。图表的脚本生成可以参考：http://www
复制链接

扫一扫