Android WebView与JS页面相互调用(五)
来源:互联网 发布:aws php sdk 编辑:程序博客网 时间:2024/06/05 21:57
JavaScript在现在的网页设计中用得很多,Android 的WebView可以载入网页,WebView也设计了与JavaScript通信的桥梁。这篇主要介绍一下WebViewk控件如何和JavaScript进行交互。
WebView:
WebView和网页相关的主要有一下几个方法:
setWebViewClient;
setWebChromeClient;
addJavascriptInterface;
loadUrl;
setWebViewClient:设置一个WebViewClient的对象,通过这个对象的几个回调方法,可以知道当前网页的状态。
setWebViewChromeClient: 设置一个WebChromeClient对象,JavaScript调用的一些内建方法都是通过这个对象来处理的。
addJavascriptInterface: 设置JavaScript的接口,有两个参数,第一个一般是一个Object对象,里面实现的方法都是网页里JavaScript可以调用到的,第二个参数是一个字符串,最后到JavaScript就相当于一个对象名,JavaScript通过这个对象名调用第一个参数里面实现的方法。要使这个方法生效,要通过WebView的getSettings方法获取WebSettings对象,设置JavaScript使能 setJavaScriptEnabled(true)。
loadUrl:载入相应网页。
下面实现了一个简单的Demo(最后有效果图): 主要的流程是载入了asset目录下的一个内置网页,点击网页上的Click按钮,会调用通过addJavascriptInterface方法设置下去的Object的show方法,这个方法里通过loadUrl的方式调用JavaScript的javaScriptshow方法,这个方法里又调用了Java的result方法,result方法里显示了一个Toast.需要注意的是show方法的回调和result方法的回调是不在主线程的。
MainActivity.java
1 package com.example.administrator.webviewl; 2 3 import android.graphics.Bitmap; 4 import android.os.Handler; 5 import android.support.v7.app.AppCompatActivity; 6 import android.os.Bundle; 7 import android.util.Log; 8 import android.webkit.JavascriptInterface; 9 import android.webkit.JsResult;10 import android.webkit.WebChromeClient;11import android.webkit.WebResourceError;12 import android.webkit.WebResourceRequest;13 import android.webkit.WebView;14import android.webkit.WebViewClient;15 import android.widget.Toast;1617 public class MainActivity extends AppCompatActivity {18 19 privatestatic final String TAG = "MainActivity.TAG";20 WebView mWebView;21Handler mHander = new Handler;22 @Override23 protected voidonCreate(Bundle savedInstanceState) {24super.onCreate(savedInstanceState);25setContentView(R.layout.activity_main);26 mWebView = (WebView)findViewById(R.id.mWebView);27 initWebView;28 }29 30 publicvoid initWebView {31mWebView.getSettings.setJavaScriptEnabled(true);32 mWebView.setWebViewClient(new WebViewClientCustom);33 mWebView.addJavascriptInterface(new Object {34 @JavascriptInterface35 public void result(final String result) {36 Log.d(TAG,"javaScript 调用java的方法 返回结果 result = " + result);37 mHander.post(new Runnable {38 @Override39 public void run {40 if (result.length > 0) Toast.makeText(MainActivity.this,"你输入了: " + result,Toast.LENGTH_SHORT).show;41 }42 });43 }44@JavascriptInterface45 public void show {46 Log.d(TAG,"JavaScript 调用java show");47 mHander.post(new Runnable {48 @Override49 public void run {50 Log.d(TAG,"java 调用 javaScript javaScriptshow");51 mWebView.loadUrl("JavaScript:javaScriptshow");52 }53 });54 return;55}56 },"JavaScriptL");57 mWebView.loadUrl("file:///android_asset/index.html");58 }59 60 publicclass WebViewClientCustom extends WebViewClient {61 @Override62 publicvoid onPageStarted(WebView view, String url, Bitmap favicon) {63 Log.d(TAG,"onPageStarted");64 super.onPageStarted(view, url, favicon);65 }66 67 @Override68 public void onPageFinished(WebView view, String url) {69 Log.d(TAG,"onPageFinished");70 super.onPageFinished(view, url);71 }72 73 @Override74 public voidonReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {75 Log.d(TAG,"onReceivedError");76 super.onReceivedError(view, request, error);77 }78 }79 }
View Code
index.html 内置的网页
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author"content=""> 7 <meta name="Keywords" content=""> 8 <metaname="Description" content=""> 9 <title>javaScript</title>10 <scripttype="text/javaScript">11 function javaScriptshow {12 var a = document.getElementById("text").value;13 JavaScriptL.result(a);14 }15</script>16 </head>17 <body style="text-align:center;margin-top:100px">18 <p > Android javaScript学习</p>19 <form action="">20 <input type="text" id = "text" value=""/>21 <input type="button"onclick="window.JavaScriptL.show" value="Click" />22 </form>23</body>24 </html>
实现的效果图如下:
- Android WebView与JS页面相互调用(五)
- Android WebView与JS页面相互调用(一)
- Android WebView与JS页面相互调用(二)
- Android WebView与JS页面相互调用(三)
- Android WebView与JS页面相互调用(四)
- Android WebView与网页JS相互调用
- Android webview 与 JS相互调用
- Android WebView JAVA 与 JS 相互调用
- Android webview开发中 js与android相互调用
- android通过webview组件实现与js相互调用
- Android的WebView中js与java代码相互调用
- Android的WebView中js与java代码相互调用
- Android之WebView与原生js之间的相互调用
- Android原生WebView与网页js相互调用
- Android webview和js的相互调用
- Android WebView 实现JS相互调用 JsBridge
- Android WebView与JavaScript代码相互调用
- js与android相互调用
- Swift
- iOS-常用的第三方库以及实例
- 实现把字典转换为XML数据
- App适配iOS 11
- Eclipse找不到zipalign tool,找不到hprof-conv.exe
- Android WebView与JS页面相互调用(五)
- JPA的几个常用方法
- 自定义的标题栏和隐藏ActionBar
- 查询数量 简单分析count(1) count(*)以及count(column)的区别
- Mac OSX的开机启动配置
- nignx.conf常规配置
- ACM退役帖(青岛赛后再更新)
- Javascript简单设计模式
- 史上最简单的生成验证码