为什么要用JS改变主题?
安卓中的高德地图API支持普通地图和卫星地图以及夜景模式地图的展示。
而JS中的高德地图API支持normal,dark(深色样式),blue_night(夜空蓝样式),fresh(浅色样式),light(osm清新风格样式)五种主题!
项目结构
可以看到,我们的assets文件夹下存放着我们即将交互的网页。
布局
代码
settings.setJavaScriptEnabled(true)
这行代码使我们的WebView支持JS脚本语言。
安卓中调用JS的方法都是通过webView.loadUrl("javascript: JS的方法名('参数')")
。
JS中的代码也是非常简单,我们自己写了一个refresh(type)
方法来供Android调用。
来而不往非礼也
在Html中如何调用Android的方法呢?
我们在Android中定义了一个类JavaScriptObject,并且调用
webView.addJavascriptInterface(new JavaScriptObject(this), "jsObj")
将Android中的JavaScriptObject对象和JS中的jsObj对象绑定起来,这里jsObj是随便取的,有意思的是在JS中并不需要new出来,而是可以直接调用jsObj对象的方法:jsObj.changeSuccess(type)
。有两点需要注意的是
- 提供给JS对象的方法必须要
@JavascriptInterface
注解,这是Google出于安全性的考虑,老版本的SDK可能并不需要加。 - 提供的方法必须要是Public。
效果图
最后来个最直观的Gif图吧~
补充
代码已上传Github https://github.com/ice45571/JsMap
webView调用多个参数的方法 webView.loadUrl("javascript: add('1','2')");
补充时间:2016年12月27日15:01
webView支持alert弹窗 webView.setWebChromeClient(new WebChromeClient() {});
补充时间:2016年12月27日15:02