Android与Javascript交互示例(一)
MainActivity如下:
package cn.testjavascript;
import android.os.Bundle;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.app.Activity;
/**
* Demo描述:
* JavaScript调用Android中的方法
* 即点击Html中按钮,调用Android中的方法
*
* 参考资料:
* http://blog.csdn.net/r8hzgemq/article/details/8480390
*/
public class MainActivity extends Activity {
private WebView mWebView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
init();
}
private void init(){
mWebView=(WebView) findViewById(R.id.webView);
initWebViewSettings();
//加载本地Html文件
mWebView.loadUrl("file:///android_asset/error.html");
//实现Android与Javascript的交互
//注意addJavascriptInterface方法中第二参数
//它表示我们的java对象javaClass的别名.这样js就可以通过该别名来调用Android中的方法
//即js代码中的:
//window.js_invoke.goNetSetting();
//window.js_invoke.reload();
JavaClass javaClass=new JavaClass(MainActivity.this,mWebView, "http://www.ifeng.com/");
mWebView.addJavascriptInterface(javaClass, "js_invoke");
}
private void initWebViewSettings(){
mWebView.setVerticalScrollBarEnabled(false);
mWebView.setHorizontalScrollBarEnabled(false);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.getSettings().setSupportZoom(true);
mWebView.getSettings().setDomStorageEnabled(true);
mWebView.getSettings().setPluginsEnabled(true);
mWebView.requestFocus();
mWebView.getSettings().setUseWideViewPort(true);
mWebView.getSettings().setLoadWithOverviewMode(true);
mWebView.getSettings().setSupportZoom(true);
mWebView.getSettings().setBuiltInZoomControls(true);
}
private class TestJSWebChromeClient extends WebChromeClient{
@Override
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
System.out.println("加载中 newProgress="+newProgress);
}
}
}
JavaClass如下:
package cn.testjavascript;
import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.webkit.WebView;
public class JavaClass {
private Context context;
private String url;
private WebView webView;
public JavaClass(Context context, WebView webView,String url) {
this.context = context;
this.webView = webView;
this.url = url;
}
public void goNetSetting() {
((Activity) this.context).startActivityForResult
(new Intent("android.settings.WIRELESS_SETTINGS"), 0);
}
public void reload() {
this.webView.loadUrl(this.url);
}
}
main.xml如下:
<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"
>
<WebView
android:id="@+id/webView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
/>
</RelativeLayout>
error.html如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="css/style_Ning.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body{background:#0F2030;}
#page{
border:1px solid #223442; background:#223442;
border-radius:8px;
-webkit-border-radius:8px;
-moz-border-radius:8px;
-o-border-radius:8px;
margin-top:20px;
color:#fff;
}
</style>
<script type="text/javascript">
window.onload=function(){
var btn_net=document.getElementById("btn_net");
btn_net.onclick=function(){
window.js_invoke.goNetSetting();
}
var btn_err=document.getElementById("btn_err");
btn_err.onclick=function(){
window.js_invoke.reload();
}
};
</script>
</head>
<body>
<div id="page">
<div class="section">
<p class="bg_err">网络出错</p>
</div>
<div class="section">
<ul>
<p>可能的原因有：</p>
<li>无手机信号或信号太弱</li>
<li>当前接入点已失效或过期</li>
<li>为正确开通手机上网服务</li>
</ul>
</div>
<div class="section">
<p style="text-align: center;"><a id="btn_err" class="btn_err" href="#"></a><a id="btn_net" class="btn_net" href="#"></a></p>
</div>
</div>
</body>
</html>
