Android与H5的交互
2015-03-09 10:29
351 查看
如今H5的广泛应用,使得Android与H5交互也变得十分广泛,这篇文章就交互问题浅谈一下。
Android通过内置的控件Webview来加载H5页面。webview的应用十分简单,只有设置一下其属性即可。代码如下:
webView.setVerticalScrollBarEnabled(false);
webView.setHorizontalScrollBarEnabled(false);
webView.getSettings().setJavaScriptEnabled(true); //加上这句话才能使用javascript方法
webView.getSettings().setDomStorageEnabled(true);
webView.requestFocus();
webView.getSettings().setUseWideViewPort(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setSupportZoom(true);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setSavePassword(false);
webView.getSettings().setSaveFormData(false);
webView.getSettings().setSupportZoom(false);
而在H5页面里面代码如下
然后接下来就是在Android里面实现交互的东西了:
webView.addJavascriptInterface(new PayJavaScriptInterface(), "demo");这句话就是给android添加javascript代码,让H5页面能够调用,第二个参数对应的是H5里面的"
“window”后面的值。
在activity里面实现H5里面的方法,注意方法之前要加上注解“@JavascriptInterface”,当android:targetSdkVersion的数值小于17无所谓,当大于等于17时就必须添加,否则不会调用方法里面的java代码。
final class PayJavaScriptInterface {
PayJavaScriptInterface()
{
}
@JavascriptInterface
public String getUserinfo() {
}
@JavascriptInterface
public boolean needLogin() {
}
}
到此,就可以实现交互功能,如果Android需要提交数据给H5的话,就可以把所需的内容转为Json串即可。
Android通过内置的控件Webview来加载H5页面。webview的应用十分简单,只有设置一下其属性即可。代码如下:
webView.setVerticalScrollBarEnabled(false);
webView.setHorizontalScrollBarEnabled(false);
webView.getSettings().setJavaScriptEnabled(true); //加上这句话才能使用javascript方法
webView.getSettings().setDomStorageEnabled(true);
webView.requestFocus();
webView.getSettings().setUseWideViewPort(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setSupportZoom(true);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setSavePassword(false);
webView.getSettings().setSaveFormData(false);
webView.getSettings().setSupportZoom(false);
而在H5页面里面代码如下
<html> | |
<head> | |
<meta charset="UTF-8"> | |
<title>交互Demo</title> | |
<meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" name="viewport"> | |
</head> | |
<body> | |
getUserinfo: | |
<div id="userinfo"></div> | |
<input value="立即报名" type="button" onClick="baoming();" /><br> | |
<script> | |
/*var rs=window.om.getUserinfo(); | |
document.getElementById('userinfo').innerHTML=rs;*/ | |
var rs=window.demo.getUserinfo(); | |
var obj = eval ("(" + rs + ")"); | |
if(obj.status){ | |
document.getElementById('userinfo').innerHTML=obj.data.nickname; | |
} | |
function baoming(){ | |
if(window.demo.needLogin()){ | |
location.href='my_demo1.html'; | |
} | |
} | |
</script> | |
</body> | |
</html> | |
webView.addJavascriptInterface(new PayJavaScriptInterface(), "demo");这句话就是给android添加javascript代码,让H5页面能够调用,第二个参数对应的是H5里面的"
“window”后面的值。
在activity里面实现H5里面的方法,注意方法之前要加上注解“@JavascriptInterface”,当android:targetSdkVersion的数值小于17无所谓,当大于等于17时就必须添加,否则不会调用方法里面的java代码。
final class PayJavaScriptInterface {
PayJavaScriptInterface()
{
}
@JavascriptInterface
public String getUserinfo() {
}
@JavascriptInterface
public boolean needLogin() {
}
}
到此,就可以实现交互功能,如果Android需要提交数据给H5的话,就可以把所需的内容转为Json串即可。
相关文章推荐
- android 与H5交互之使用GPS定位
- H5和Android交互
- Android与H5交互
- [置顶] Android与H5的交互
- Android和H5之间的交互
- Android与H5的交互
- h5页面与Android原生页面交互
- Android与H5交互
- Android与H5交互(混合开发)
- Android和H5(JS)简单交互
- Android和H5的交互问题
- android native 与h5 交互技巧
- DCloud H5与Android Native的交互--5+ SDK插件开发
- Android与H5交互
- H5与android原生的JS交互
- Android与H5交互(java与js的交互)
- android webview设置以及与h5交互
- android app与h5交互
- Android与H5数据交互
- Android h5 交互