Android利用WebView与JavaScript交互的方法

翊寒 2011-12-31

使用WebView播视频,整了个优酷的开发页面,但装上Android,没反应。不过,在使用webView时,倒是对webView与html中的javascript的调用方式学习了一下,还是使用的网上的经典案例。

Java代码:

  1. public class WebViewDemo extends Activity {     
  2.     private WebView mWebView;     
  3.     private Handler mHandler = new Handler();     
  4.     
  5.     public void onCreate(Bundle icicle) {     
  6.         super.onCreate(icicle);     
  7.         setContentView(R.layout.webviewdemo);     
  8.         mWebView = (WebView) findViewById(R.id.webview);     
  9.         WebSettings webSettings = mWebView.getSettings();     
  10.         webSettings.setJavaScriptEnabled(true);     
  11.         mWebView.addJavascriptInterface(new Object() {     
  12.             public void clickOnAndroid() {     
  13.                 mHandler.post(new Runnable() {     
  14.                     public void run() {     
  15.                         mWebView.loadUrl("javascript:wave()");     
  16.                     }     
  17.                 });     
  18.             }     
  19.         }, "demo");     
  20.         mWebView.loadUrl("file:///android_asset/demo.html");     
  21.     }     
  22. }    

addJavascriptInterface(Object obj,String interfaceName)方法,该方法将一个java对象绑定到一个javascript对象中,javascript对象名就是interfaceName,作用域是Global。这样初始化webview后,在webview加载的页面中就可以直接通过javascript:window.demo访问到绑定的java对象了。来看看在html中是怎样调用的:

HTML(javascript)的代码:

  1. <html>    
  2.         <script language="javascript">    
  3.                 function wave() {     
  4.                     document.getElementById("droid").src="android_waving.png";     
  5.                 }     
  6.         </script>    
  7.         <body>    
  8.             <a onClick="window.demo.clickOnAndroid()">    
  9.                                 <img id="droid" src="android_normal.png"/><br>    
  10.                                 Click me!     
  11.             </a>    
  12.         </body>    
  13. </html>    
        这样在javascript中就可以调用java对象的clickOnAndroid()方法了,wave()方法是java中调用javascript的例子。

对于webview加载网页有三种方式:

  1. //打开本包内asset目录下的index.html文件   
  2.      wv.loadUrl(" file:///android_asset/testvideo.html");    
  3.      //打开本地sd卡内的index.html文件   
  4.      wv.loadUrl("content://com.android.htmlfileprovider/sdcard/testvideo.html");  
  5.      //打开指定URL的html文件   
  6.      wv.loadUrl("http://v.youku.com/v_show/id_XMzM3NTg0ODA4.html");  
    为了让WebView从apk文件中加载assets,Android SDK提供了一个schema,前缀为"file:///android_asset/"。WebView遇到这样的schema,就去当前包中的assets目录中找内容。如上面的"file:///android_asset/demo.html"

addJavascriptInterface方法中要绑定的Java对象及方法要运行另外的线程中,不能运行在构造他的线程中,这也是使用Handler的目的

如果要用HTML5来开发应用,统一Android与 Iphone的应用,那必须要在关键环节让原生代码与HTML5交互,与flex一样,都是依靠javascript。

相关推荐