您的位置:首页 > 移动开发 > Android开发

Android中 Js 扩展及交互

2012-06-03 19:12 134 查看
Android中的JS扩展有2中方式:

1.利用webkit提供的js扩展接口在 java层扩展,直接由app实现

优点:容易

缺点:跟app耦合,其他app不能使用该js扩展

2.利用npapi在cpp层扩展

优点:所有app都能共享该扩展

缺点:相对有难度

引擎主要分为3大模块

1.webkit 平台相关代码,是对以下2模块的平台port封装

2.webcore 实现layout排版;渲染;当检测html中含有js脚本时交由jscore处理

3.javascriptcore/v8 解析js脚本,并执行

jscore跟webcore的交互 主要跟binding有关系。数据类型有map映射,一般的js扩展不涉及jscore的改动







通过Android webview实现与javascript函数相互调用

[java]
view plaincopyprint?

public
class WebViewDemo extends Activity {
private WebView mWebView;
private Handler mHandler = new Handler();
public
void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.webviewdemo);
mWebView = (WebView) findViewById(R.id.webview);
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true); //webview支持javascript

mWebView.addJavascriptInterface(new Object() { //添加javascript可调用的接口

public
void clickOnAndroid() {
mHandler.post(new Runnable() {
public void run() {
mWebView.loadUrl("javascript:wave()");
}
});
}
}, "demo");
mWebView.loadUrl("file:///android_asset/demo.html"); //调用的网页
}
}

[java]
view plaincopyprint?

</pre><pre name="code" class="java"><pre name="code" class="html">

</pre><pre name="code" class="java"><pre name="code" class="html">


[html]
view plaincopyprint?

demo.html:

[html]
view plaincopyprint?

<html>
<script language="javascript">
function wave() { //准备在activity里调用的函数
document.getElementById("droid").src="android_waving.png";
}
</script>

<html>
<script language="javascript">
function wave() { //准备在activity里调用的函数
document.getElementById("droid").src="android_waving.png";
}
</script>


[html]
view plaincopyprint?

<body>
<a onClick="window.demo.clickOnAndroid()"> //调用activity的clickOnAndroid()函数
<imgidimgid="droid"src="android_normal.png"/><br>Click me!
</a>
</body>
l>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: