生活随笔
收集整理的這篇文章主要介紹了
Android WebView与js交互通信
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
事出有因,那天我看到手廳的客戶端里,在網頁webview中點擊網絡設置后,跳轉到了手機的網絡設置界面,然后就搜了一下,原來是html中js與androidApp之間的交互。這么說的太費勁了,還是上截圖吧,如下:
手機沒網的時候,會彈出上面這個網頁,然后我們通過快捷按鈕“網絡設置”后,界面跳轉到如下
這個是通過js和webview共同完成的一個交互效果。
首先,在js中如下:
[javascript]?view plaincopy
<script?type="text/javascript">?? window.οnlοad=function(){?? ????var?btn_net=document.getElementById("btn_net");?? ????btn_net.οnclick=function(){?? ???????window.js_invoke.goNetSetting();?? ????}?? ????var?btn_err=document.getElementById("btn_err");?? ????btn_err.οnclick=function(){?? ???????window.js_invoke.reload();?? ????}?? };?? ?? </script>??
其中window后面的"js_invoke"這個別名是和app中webview設置的對象別名一致的,下面會寫到,而后面的goNetSetting()和reload()方法是那個對象的里的方法。
然后,在activity對webview做一個關鍵的設置如下:
[java]?view plaincopy
this.mainView.addJavascriptInterface(new?RemoteInvokeService(this,?this.mainView,?this.url,?null),?"js_invoke");??
RemoteInvokeService(……)這個對象就是上面提到的對象,這里面我們定義了網絡設置和重新加載的方法,例如下:
[java]?view plaincopy
public?void?goNetSetting()?? {?? ??this.context.startActivityForResult(new?Intent("android.settings.WIRELESS_SETTINGS"),?0);?? }?? ?? ??public?void?reload()?? {?? ??this.webView.loadUrl(this.url);?? }??
當然了,這個對象的構造函數不一樣要傳這幾個參數,根據需求傳就可以了。這里的構造函數是這樣:
[java]?view plaincopy
public?RemoteInvokeService(Activity?paramActivity,?WebView?paramWebView,?String?paramString1,?String?paramString2)?? ?{?? ???this.context?=?paramActivity;?? ???this.webView?=?paramWebView;?? ???this.url?=?paramString1;?? ???this.returnIntent?=?paramString2;?? ?}??
error.html:
[html]?view plaincopy
<!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>??
RemoteInvokeService.java
[java]?view plaincopy
package?cn.com.web;?? ?? import?android.app.Activity;?? import?android.content.Intent;?? import?android.webkit.WebView;?? ?? public?class?RemoteInvokeService?{?? ????private?Activity?context;?? ????private?String?url;?? ????private?WebView?webView;?? ?? ????public?RemoteInvokeService(Activity?paramActivity,?WebView?paramWebView,?? ????????????String?paramString1)?{?? ????????this.context?=?paramActivity;?? ????????this.webView?=?paramWebView;?? ????????this.url?=?paramString1;?? ????}?? ?? ????public?void?goNetSetting()?{?? ????????this.context.startActivityForResult(new?Intent(?? ????????????????"android.settings.WIRELESS_SETTINGS"),?0);?? ????}?? ?? ????public?void?reload()?{?? ????????this.webView.loadUrl(this.url);?? ????}?? }??
主要代碼:
[java]?view plaincopy
package?cn.com.web;?? ?? import?cn.com.web.R;?? import?android.app.Activity;?? import?android.app.AlertDialog;?? import?android.content.DialogInterface;?? import?android.graphics.Bitmap;?? import?android.os.Bundle;?? import?android.view.KeyEvent;?? import?android.view.MotionEvent;?? import?android.view.View;?? import?android.view.Window;?? import?android.view.View.OnTouchListener;?? import?android.webkit.WebChromeClient;?? import?android.webkit.WebView;?? import?android.webkit.WebViewClient;?? import?android.widget.EditText;?? import?android.widget.ImageView;?? import?android.widget.LinearLayout;?? import?android.widget.TextView;?? import?android.widget.Toast;?? ?? ? ? ? ?? public?class?WebViewApp?extends?Activity?{?? ?? ?????? ????private?WebView?webView;?? ?? ?????? ????private?String?browserUrl?=?"file:///android_asset/error.html";?? ?? ????@Override?? ????protected?void?onCreate(Bundle?savedInstanceState)?{?? ????????super.onCreate(savedInstanceState);?? ????????requestWindowFeature(Window.FEATURE_NO_TITLE);?? ?????????? ?????????? ????????setContentView(R.layout.browser_layout);?? ????????initWebView();?? ????}?? ?? ????? ? ?? ????private?void?initWebView()?{?? ?????????? ????????webView?=?(WebView)?findViewById(R.id.browser_layout_webview);?? ?????????? ????????webView.getSettings().setJavaScriptEnabled(true);?? ?????????? ????????webView.getSettings().setBuiltInZoomControls(true);?? ?????????? ????????webView.getSettings().setSaveFormData(false);?? ?? ?????????? ????????webView.clearCache(true);?? ?????????? ????????webView.clearHistory();?? ?????????? ????????webView.loadUrl(browserUrl);?? ?????????? ?????????? ?????????? ?????????? ????????webView.setWebViewClient(new?WebViewClient()?{?? ?? ?????????????? ????????????@Override?? ????????????public?void?onPageStarted(WebView?view,?String?url,?Bitmap?favicon)?{?? ????????????????setProgressBarIndeterminateVisibility(true);?? ????????????????browserUrl?=?url;?? ????????????????super.onPageStarted(view,?url,?favicon);?? ????????????}?? ?? ?????????????? ????????????public?boolean?shouldOverrideUrlLoading(WebView?view,?String?url)?{?? ????????????????webView.loadUrl(url);?? ????????????????return?true;?? ????????????}?? ?? ?????????????? ????????????@Override?? ????????????public?void?onReceivedError(WebView?view,?int?errorCode,?? ????????????????????String?description,?String?failingUrl)?{?? ????????????????super.onReceivedError(view,?errorCode,?description,?failingUrl);?? ????????????}?? ?? ?????????????? ????????????@Override?? ????????????public?void?onPageFinished(WebView?view,?String?url)?{?? ????????????????setProgressBarIndeterminateVisibility(false);?? ????????????????super.onPageFinished(view,?url);?? ????????????}?? ?? ????????});?? ?? ????????webView.setWebChromeClient(new?WebChromeClient()?{?? ?????????????? ????????????public?void?onProgressChanged(WebView?view,?int?newProgress)?{?? ?????????????????? ????????????????WebViewApp.this.getWindow().setFeatureInt(?? ????????????????????????Window.FEATURE_PROGRESS,?newProgress?*?100);?? ????????????????super.onProgressChanged(view,?newProgress);?? ????????????}?? ?? ?????????????? ????????????public?void?onReceivedTitle(WebView?view,?String?title)?{?? ????????????????WebViewApp.this.setTitle(title);?? ????????????????super.onReceivedTitle(view,?title);?? ????????????}?? ????????});?? ????????webView.addJavascriptInterface(new?RemoteInvokeService(WebViewApp.this,?? ????????????????webView,?"http://www.baidu.com/"),?"js_invoke");?? ????}?? ?? ????? ? ?? ????public?boolean?onKeyDown(int?keyCode,?KeyEvent?event)?{?? ????????if?((keyCode?==?KeyEvent.KEYCODE_BACK?&&?webView.canGoBack()))?{?? ????????????webView.goBack();?? ????????????return?true;?? ????????}?? ????????return?super.onKeyDown(keyCode,?event);?? ????}?? ?? } ?
代碼下載
總結
以上是生活随笔為你收集整理的Android WebView与js交互通信的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。