webview中的js调用native的实例
一、首先简单的布局文件main.xml，主要有两个控件我们主要研究webview控件：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="@string/hello_world" />
<WebView
android:id="@+id/appView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</RelativeLayout>
--------------------------------------------------------------------
二、定义的activity文件MainActivity.java：
package com.liu;
import org.apache.cordova.DroidGap;
import android.os.Bundle;
import android.webkit.WebView;
import android.annotation.SuppressLint;
import android.app.Activity;
@SuppressLint("SetJavaScriptEnabled")
public class MainActivity extends Activity {
private WebView appView;
@Override
public void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
appView = (WebView) findViewById(R.id.appView);
//appView = new WebView(this);
appView.getSettings().setJavaScriptEnabled(true);
appView.addJavascriptInterface(new PluginMethod(this, appView), "SM"); // 注意这里一句
//appView.setIntegerProperty("splashscreen", R.drawable.ic_launcher);
appView.loadUrl("file:///android_asset/www/accountInfo.html");
}
}
其中
1、appView.addJavascriptInterface(new PluginMethod(this, appView), "SM"); // 注意这里一句
是主要注册给js调用本地方法的接口
2、appView.loadUrl("file:///android_asset/www/accountInfo.html");
这句主要是加载本地的html文件，
-----------------------------------------------------------------------------------------
三、本地被js调用的函数及其方法PluginMethod.java：
package com.liu;
import org.apache.cordova.CordovaWebView;
import org.apache.cordova.DroidGap;
import android.content.Context;
import android.util.Log;
import android.webkit.WebView;
public class PluginMethod {
Context droidGap;
WebView webView;
public PluginMethod(Context droidGap, WebView appView) {
this.droidGap = droidGap;
this.webView = webView;
}
/**
* JS调用 用于更新App
* @param path 更新门店的地址
*/
public void UpdateApp(final String path) {
Log.e("---------------", path); //注意这里日志输出
}
}
-----------------------------------------------------------------
四、本地的html文件accountInfo.html：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<title>Hello World</title>
<style type="text/css" >body,div,p{font-size:28px;line-height:150%;}</style>
</head>
<body>
账号公司信息demo：
<br />
<input type="button" value="读取账号信息" οnclick="window.SM.UpdateApp('http://192.168.0.1');"/>
<div id="info"></div>
</body>
</html>
这样运行这个程序，则点击按钮就会调用本地的java方法