频道栏目
首页 > 资讯 > Android基础教程 > 正文

第99章、Android调用Javascript(从零开始学Android)

16-02-02        来源:[db:作者]  
收藏   我要投稿
在某些Android应用中,使用Javascript调用Android中的方法也是会用到的。

(1)用WebView来显示HTML代码;
(2)允许WebView执行JavaScript
webView.getSettings().setJavaScriptEnabled(true);
(3)获取到HTML文件,也可从网络中获取
webView.loadUrl("file:///android_asset/index.html"); (注意:index.html文件要存放在assets文件夹中)
(4)为javascript提供一个回调的接口,这里要注意,一定要在单独的线程中实现,要不会阻塞线程的
addJavascriptInterface(Object obj, String interfaceName) 中obj代表一个java对象,这里我们一般会实现一个自己的类,类里面提供我们要提供给javascript访问的方法 
interfaceName则是访问我们在obj中声明的方法时候所用到的js对象,调用模式为window.interfaceName.方法名()
(5)webChromeClient提供了一系列与javascript相对应的方法:代码调用特定方法时,我们一般在其内部将javascript形式的展示切换为android的形式。

一、设计界面

1、布局文件

打开res/layout/activity_main.xml文件。
输入以下代码:

[html] view plain copy
 
  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="match_parent"   
  5. android:layout_height="match_parent" >   
  6.     <WebView   
  7.         android:id="@+id/webview"   
  8.         android:layout_width="match_parent"   
  9.         android:layout_height="match_parent" />  
  10.   
  11. </LinearLayout>   

 

二、程序文件

1、MainActivity.java

打开“src/com.genwoxue.webviewandroidjs/MainActivity.java”文件。
然后输入以下代码:

[java] view plain copy
 
  1. package com.genwoxue.webviewandroidjs;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.os.Handler;  
  6. import android.webkit.JsResult;  
  7. import android.webkit.WebChromeClient;  
  8. import android.webkit.WebView;  
  9. import android.widget.Toast;  
  10.   
  11. public class MainActivity extends Activity {  
  12.     private WebView webView=null;  
  13.     Handler handler = new Handler();    
  14.       
  15.     public void onCreate(Bundle savedInstanceState) {  
  16.         super.onCreate(savedInstanceState);  
  17.         setContentView(R.layout.activity_main);  
  18.         //实例化WebView  
  19.         webView = (WebView) findViewById(R.id.webview);  
  20.         //允许JavaScript执行  
  21.         webView.getSettings().setJavaScriptEnabled(true);  
  22.         //加载HTML文件:注意存放到至assets文件夹,你也可以放到互联网。  
  23.         webView.loadUrl("file:///android_asset/index.html");  
  24.           
  25.   
  26.         //webChromeClient提供了一系列与javascript相对应的方法  
  27.         //代码调用特定方法时,我们一般在其内部将javascript形式的展示切换为android的形式。    
  28.         //例如:我们重写了onJsAlert方法,那么当页面中需要弹出alert窗口时,便会在Android中以Toast的形式提示用户。   
  29.         class MyWebChromeClient extends WebChromeClient {    
  30.             @Override    
  31.             public boolean onJsAlert(WebView view, String url, String message,    
  32.                     JsResult result) {    
  33.                 Toast.makeText(getApplicationContext(), message,    
  34.                         Toast.LENGTH_LONG).show();    
  35.                 return true;    
  36.             }    
  37.         }    
  38.     
  39.         webView.setWebChromeClient(new MyWebChromeClient());    
  40.           
  41.         //为javascript提供一个回调的接口,这里要注意,一定要在单独的线程中实现,要不会阻塞线程的   
  42.         //addJavascriptInterface(Object obj, String interfaceName)   
  43.         // obj代表一个java对象,这里我们一般会实现一个自己的类,类里面提供我们要提供给javascript访问的方法   
  44.         // interfaceName则是访问我们在obj中声明的方法时候所用到的js对象,调用模式为window.interfaceName.方法名()   
  45.         webView.addJavascriptInterface(new Object() {    
  46.             public void show() {    
  47.                 handler.post(new Runnable() {    
  48.                     @Override    
  49.                     public void run() {    
  50.                         //通过webView.loadUrl("javascript:xxx")方式就可以调用当前网页中的名称   
  51.                         // 为xxx的javascript方法   
  52.                         webView.loadUrl("javascript:show()");    
  53.                     }    
  54.                 });    
  55.             }    
  56.     
  57.         }, "AndroidJs");    
  58.     }  
  59. }  

2、index.html
新建“assets/index.html”文件。
然后输入以下代码:

[html] view plain copy
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2.   
  3. <html>  
  4.   
  5.   <head>  
  6.       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  7.    
  8.       <title>Calculate</title>  
  9.         
  10.   </head>  
  11.   
  12.   <script language="JavaScript">  
  13.      function show(){  
  14.         var n=document.getElementById("number").value;  
  15.         alert(n*n);  
  16.      }  
  17.   </script>   
  18.   
  19.   <body>  
  20.    
  21.      <input type="text" id="number">  
  22.      <input type="submit" value="Calculate" onClick="show()">  
  23.   </body>  
  24. </html>  


三、配置文件

采用“AndroidManifest.xml”默认生成文件。

四、运行结果

相关TAG标签
上一篇:Win7系统右键菜单添加删除选项的设置方法
下一篇:第98章、WebView组件(从零开始学Android)
相关文章
图文推荐

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站