首页 > 代码库 > Android程序中Web页面和NativeCode交互

Android程序中Web页面和NativeCode交互

首先应该在AndroidManifest.xml把下面这个加上使得具有网络访问权限

<uses-permission android:name="android.permission.INTERNET"/>

然后在布局文件上插入WebView main.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <WebView        android:id="@+id/webView1"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_weight="1" />        <LinearLayout         android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:orientation="vertical"        android:layout_weight="1">     <TextView                android:id="@+id/textView1"        android:layout_width="wrap_content"        android:layout_height="match_parent"               android:textAppearance="?android:attr/textAppearanceLarge" />   </LinearLayout></LinearLayout>

 

本地Code 创建 一个JavaScriptInterface的实例

final JavaScriptInterface myJavaScriptInterface = new JavaScriptInterface(this);

 

然后添加接口

Wv.addJavascriptInterface(myJavaScriptInterface, "AndroidFunction");

这个Wv是WebView实例 AndroidFunction 是在HTML页面上用到的JavaScript 的function

我们在html中调用AndroidFunction的时候就可以用变换到本地代码了

 

Java的全部代码如下

  

package my.demo;import android.app.Activity;import android.content.Context;import android.os.Bundle;import android.os.Handler;import android.webkit.WebView;import android.widget.TextView;import android.widget.Toast;public class JavaScriptInterfaceDemoActivity extends Activity {    private WebView Wv;    private TextView myTextView;        final Handler myHandler = new Handler();        /** Called when the activity is first created. */    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);               setContentView(R.layout.main);        Wv = (WebView)findViewById(R.id.webView1);        myTextView = (TextView)findViewById(R.id.textView1);                final JavaScriptInterface myJavaScriptInterface         = new JavaScriptInterface(this);                          Wv.getSettings().setLightTouchEnabled(true);        Wv.getSettings().setJavaScriptEnabled(true);        Wv.addJavascriptInterface(myJavaScriptInterface, "AndroidFunction");        Wv.loadUrl("file:///android_asset/www/index.html");     }        public class JavaScriptInterface {        Context mContext;        JavaScriptInterface(Context c) {            mContext = c;        }                public void showToast(String webMessage){                        final String msgeToast = webMessage;                         myHandler.post(new Runnable() {                 @Override                 public void run() {                     // This gets executed on the UI thread so it can safely modify Views                     myTextView.setText(msgeToast);                 }             });           Toast.makeText(mContext, webMessage, Toast.LENGTH_SHORT).show();        }    }}

 

html页面如下

 

<!DOCTYPE html><html>    <head>        <meta charset=utf-8" />        <meta name="viewport"           content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">        <meta name="apple-mobile-web-app-capable" content="yes">        <meta name="viewport" content="target-densitydpi=device-dpi" />        <script type="text/javascript">           function init()           {               var testVal = document.getElementById(mytextId).value;               AndroidFunction.showToast(testVal);           }        </script>    </head>    <body>                <div style="float: left;width: 50%;">           <input type="text" style="width: 180px;"                    name="myText" id="mytextId" />                   </div>        <div style="clear: both;height: 3px;"> </div>        <div>          <input value="submit" type="button" name="submit"             id="btnSubmit" onclick="javascript:return init();" />         </div>      </body></html>

 

比较简单方便