LightWebviewBridge定位为一个轻量级、小而美的Hybrid混合APP解决方案工具,帮助开发者快速实现H5APP或内嵌H5界面功能,只聚焦于业务功能开发,而不用关注H5和Native的通信实现,便可快速实现相应业务功能,达到类似小程序、公众号的效果;

Demo 场景:1.获取设备信息;2.创建二维码;3.扫码获取信息;4.打电话;......

demo.gif

• 功能流程架构

流程图

以创建二维码QR为例:

• index.html

 function createQr(){
 let data = document.getElementById("qrData").value
 callToNative("createQr",data,function (response) {
 document.getElementById("qrImg").src = "data:image/jpeg;base64," + response
 })
 }

H5通过callToNative("createQr",data,function (response){ ... })调用原生能力

• bridgeConfig.json

 "createQr": {
 "methodName": "createQr",
 "className": "com.rj.lightwebviewbridge.functions.Qr"
 }

配置,com.rj.lightwebviewbridge.functions.Qr.createQr 即 创建二维码的实现。

• Qr.kt

 fun createQr(data : String){
 val bitmap = CodeUtils.createQRCode(data,600)
 val bytes = ConvertUtils.bitmap2Bytes(bitmap)
 val base64 = EncodeUtils.base64Encode2String(bytes)
 callbackToJS(base64)
 }

原生功能执行,通过callbackToJS(base64)将结果数据返回给H5处理。

• H5与Native的通信及回调
• 通信引擎统一标准化实现,无需重复实现jsinterface加载
• H5资源动态加载更新
• Demo UI优化
• 更多通用模块能力

• 请求体(Request)三要素:

  1.funcId(必填):功能唯一ID值,作为原生功能的映射,从bridgeConfig匹配

  2.data(选填):输入数据

  3.function(选填):原生功能执行后回调函数。

• bridgeConfig.json

​ H5调用Native能力的映射配置文件

如果您喜欢LightWebviewBridge,或感觉帮助到了您,可以点右上角"Star"支持一下,您的支持就是我的动力,谢谢!