和原來一樣，通過對象互相傳值。 webview傳遞對象給js調用，webview則通過
mWebview.loadUrl("javaScript:方法名（參數）")來調用js中的方法，需要注意的是調用js方法必須在主線程。
1.懶加載：使用時才初始化, 類型聲明爲val
private val mWebview:WebView by lazy {
webview
}2. 當js需要java中的數據時，js調java方法，java再調用js中的方法將數據做爲參數傳給js。
回調js方法名，可以不寫死，由js將方法名傳過來。（解耦）
4.貼上相關代碼
(1) kotlinHtml.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
button{
width : 100%;
height:50px;
margin-top:20px
}
</style>
</head>
<body>
<button id="btn1">js調用kotlin方法</button>
<button id="btn2">kotlin調用js方法</button>
<script src="jquery-1.11.3.js"></script>
<script>
$("#btn1").on("click",function(){
console.log("點擊了");
//調用kotlin方法
var json = {"name":"html5"}
window.jsInterface.showToast(JSON.stringify(json))
});
//H5 callback調用kotlin方法
$("#btn2").on("click",function(){
//callback:1.調用kotlin方法
var json = {"callback":"receiveHotelData"}
window.jsInterface.getHotelData(Jsp);
});
var showMessage = function(json){
alert(JSON.stringify(json))
}
var receiveHotelData = function(json){
alert(JSON.stringify(json))
}
</script>
</body>
</html>需要引用jquery:
<script src="jquery-1.11.3.js"></script>(2)JavaScriptMethods
import android.content.Context
import android.webkit.JavascriptInterface
import android.webkit.WebView
import org.jetbrains.anko.doAsync
import org.jetbrains.anko.runOnUiThread
import org.jetbrains.anko.toast
import org.json.JSONObject
import java.net.URL
/**
* H5與kotlin通信的橋樑類
* Created by Administrator on 2018/3/10.
*/
class JavaScriptMethods {
private var mContext: Context? = null
private var mWebView:WebView? = null
constructor(mContext: Context?, mWebView: WebView?) {
this.mContext = mContext
this.mWebView = mWebView
}
@JavascriptInterface
fun showToast(json: String) {
// Toast.makeText(mContext,json,Toast.LENGTH_SHORT).show()
// mContext?.toast(json)
mContext?.let { it.toast(json) }
}
@JavascriptInterface
fun getHotelData(json: String){
val jsonObject = JSONObject(json)
val callback = jsonObject.optJSONObject("callback")
doAsync {
var url = URL("http://www.jingbanyun.com")
// 變成字符串
val result = url.readText()
var json = JSONObject()
json.put("name",result)
//調用js方法必須在主線程
mContext?.let {
it.runOnUiThread {
mWebView?.let {
it.loadUrl("javaScript:"+callback+"("+json+")")
}
}
}
}
}
}(3)MainActivity
class MainActivity : AppCompatActivity() {
//懶加載，使用時才初始化, 類型聲明爲val
private val mWebview:WebView by lazy {
webview
}
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
setWebView()
}
//lambda表達式｛參數->返回值｝
// var add = {a:Int,b:Int ->a+b}
var setWebView = {
//1.開啓Kotlin與H5通信開關
mWebview.settings.javaScriptEnabled = true
//2.設置2個WebViewClient
mWebview.webViewClient = MyWebViewClient()
mWebview.webChromeClient = MyWebChromClient()
//kotlin與H5通信方式1：H5調用Kotlin方法
//設置kotlin與H5的通信橋樑類
mWebview.addJavascriptInterface(JavaScriptMethods(this,mWebview),"jsInterface")
//kotlin與H5通信方式1：H5調用Kotlin方法
//加載網頁
mWebview.loadUrl("file:///android_asset/kotlinHtml.html")
}
inner private class MyWebViewClient: WebViewClient(){
override fun onPageFinished(view: WebView?, url: String?) {
//頁面加載完成
super.onPageFinished(view, url)
//kotlin與H5通信方式2：Kotlin調用H5方法
// mWebview.loadUrl("javaScript:方法名（參數）")
var json = JSONObject()
json.put("name","Kotlin")
mWebview.loadUrl("javaScript:showMessage("+json+")")
}
}
private class MyWebChromClient : WebChromeClient(){
//加載進度條
override fun onProgressChanged(view: WebView?, newProgress: Int) {
super.onProgressChanged(view, newProgress)
}
}
}