ZWebView
ZWebView for Hybird App，建立移動(dòng)端和Web的JS橋接框架，主要包含了多種常用協(xié)議的約束和定義。Android的WebView使用更方便。
最新介紹
https://www.zyao89.cn/blog/article/5a97fa8b632e353ffd14d44a
可在此網(wǎng)站進(jìn)行留言。
Github: ZWebView.git
更新說(shuō)明
- 1.0.0 創(chuàng)建Android庫(kù)zweb
- 1.0.1 更新一些簡(jiǎn)單問(wèn)題
- 1.0.2 添加新注解
@ZJson，修復(fù)IOC實(shí)現(xiàn)方式無(wú)法傳json參數(shù) - 1.0.3 添加新注解
@ZData，傳入字符串，web端接收到的參數(shù)格式為 { 'ZData', String }
Web
分為三種方式
- Vue插件注入方式（有些問(wèn)題，不建議使用）
使用Vue時(shí)，可導(dǎo)入vue-zweb插件使用。具體參考 vue-zweb
- H5標(biāo)簽協(xié)議注入方式
可通過(guò)在html文件中引入 <script> 標(biāo)簽，控制引入框架的位置。
協(xié)議在標(biāo)簽的 src 下，以地址方式注入，具體格式采用：zweb:// 開(kāi)頭。
目前支持的協(xié)議如下：
1. zweb://__init__
具體引入方式如下：
<script type="text/javascript" src="zweb://__init__"></script>
- 普通手動(dòng)注入方式
Android
引入方式：
Gradle > v3.0
implementation 'com.zyao89.view:zweb:1.0.2'
Gradle < v3.0
compile 'com.zyao89.view:zweb:1.0.2'
安卓也對(duì)應(yīng)采用三種交互方式
對(duì)應(yīng)的3中枚舉類(lèi)型如下：
public enum InjectionMode
{
// vue插件方式，引入 vue-zweb.js 例如：<script type="text/javascript" src="static/libs/vue-zweb.min.js"></script>
VuePlugin,
// 協(xié)議方式：zweb:// 例如：<script type="text/javascript" src="zweb://__init__"></script>
Protocol,
// 普通人工引入 <script type="text/javascript" src="static/zweb.js"></script>
Normal
}
基本使用方式：
- Step1，初始化：
在自定義的Application中初始化ZWebView，方法如下：
@Override
public void onCreate()
{
super.onCreate();
ZWebInstance.init(this);
}
- Step2，構(gòu)建
ZWebConfig配置文件，并創(chuàng)建ZWeb對(duì)象實(shí)例。
String MAIN_HTML = "file:///android_asset/index.html";
// 1. 創(chuàng)建配置文件，并帶入主頁(yè) URL
ZWebConfig config = new ZWebConfig.Builder(ZWebConstant.MAIN_HTML_TEST)
// 注冊(cè)狀態(tài)監(jiān)聽(tīng)
.setOnStateListener(this)
// 注冊(cè)原生協(xié)議UI實(shí)現(xiàn)
.setNativeMethodImplement(this)
// 注冊(cè)一些特殊的實(shí)現(xiàn)方法
// .setOnSpecialStateListener(this)
// 選擇注入模式
.setInjectionMode(InjectionMode.VuePlugin)
// 自動(dòng)注入框架腳本JS（建議配置）
.autoInjectFramework()
// 自動(dòng)注入擴(kuò)展方法
.autoInjectExtendsJS()
// 添加 assets 中js文件注入
// .addInjectJSAssetsFile("js/test.js")
// 添加 raw 中js文件注入
// .addInjectJSRawFile(R.raw.index_test)
.build();
// 2. 創(chuàng)建ZWeb對(duì)象實(shí)例.
mZWebInstance = ZWebInstance.createInstance(config);
- Step3，傳遞Activity的生命周期，如下：
// mRootView 為根ViewGroup容器 （必須）
@Override
protected void onCreate(Bundle savedInstanceState)
{
//...
mZWebInstance.onActivityCreate(mRootView);
//...
}
// 分別實(shí)現(xiàn)其他生命周期傳遞
@Override
public void onBackPressed()
{
if (!mZWebInstance.onActivityBack())
{
super.onBackPressed();
}
}
@Override
protected void onPause()
{
mZWebInstance.onActivityPause();
super.onPause();
}
@Override
protected void onResume()
{
mZWebInstance.onActivityResume();
super.onResume();
}
@Override
protected void onStart()
{
mZWebInstance.onActivityStart();
super.onStart();
}
@Override
protected void onStop()
{
mZWebInstance.onActivityStop();
super.onStop();
}
@Override
protected void onDestroy()
{
mZWebInstance.onActivityDestroy();
super.onDestroy();
}
一些內(nèi)部狀態(tài)監(jiān)聽(tīng)實(shí)現(xiàn)
以下為實(shí)現(xiàn)監(jiān)聽(tīng)狀態(tài)接口時(shí)，所需要實(shí)現(xiàn)的方法。
/**
* 框架初始化成功后回調(diào)
*
* @param zWebHandler
* @param width 寬
* @param height 高
*/
void onZWebCreated(IZWebHandler zWebHandler, int width, int height);
/**
* 異常（JS如果有異常會(huì)在這里回調(diào)）
*
* @param zWebHandler
* @param errorCode 錯(cuò)誤碼
* @param message 錯(cuò)誤信息
*/
void onZWebException(IZWebHandler zWebHandler, long errorCode, String message);
/**
* 網(wǎng)絡(luò)請(qǐng)求處理
*
* @param zWebHandler
* @param url 鏈接
* @param method 請(qǐng)求方法
* @param data 數(shù)據(jù)
* @param type 返回類(lèi)型
* @param controller
*/
void onZWebRequire(IZWebHandler zWebHandler, String url, String method, String data, String type, IZRequireController controller);
/**
* 異步消息請(qǐng)求
*
* @param zWebHandler
* @param cmd 命令名稱(chēng)
* @param data 數(shù)據(jù)
*/
void onZWebMessage(IZWebHandler zWebHandler, String cmd, String data, IZMessageController controller);
/**
* JS銷(xiāo)毀
*
* @param zWebHandler
*/
void onZWebDestroy(IZWebHandler zWebHandler);
/**
* JS日志信息回調(diào)，可在這里記錄或打印
*
* @param zWebHandler
* @param type 類(lèi)型
* @param msg 信息
*/
void onZWebLog(IZWebHandler zWebHandler, String type, String msg);
以上接口部分實(shí)現(xiàn)方式可參考 MainActivity.java
IOC實(shí)現(xiàn) js 請(qǐng)求方法封裝
- 定義調(diào)用JS的方法接口
public interface RequireService
{
@ZMethod("a") // callReceiver
boolean callA(@ZKey("KeyA") String a, @ZKey("KeyB") String b, @ZKey("Time") long time);
@ZFunction("init")
boolean init(@ZKey("A") String a, @ZKey("B") String b, @ZKey("C") int c);
@ZMethod(ZMethodName.ON_READY)
void initParam(@ZKey("Msg") String msg, @ZKey("Skin") int skin, @ZKey("Color") int color);
@ZFunction(ZFunctionName.REFRESH)
void refresh();
@ZFunction("newInit")
boolean newInit(@ZJson String oJson);
@ZFunction("newInit2")
boolean newInit2(@ZData String str);
}
各種注解介紹：
@ZFunction("方法名稱(chēng)")： 用于調(diào)用JS中
ZWebSDK.extends('方法名稱(chēng)', function(oData){});擴(kuò)展方法的調(diào)用。
@ZMethod("監(jiān)聽(tīng)名稱(chēng)")：用于JS中
ZWebSDK.on('監(jiān)聽(tīng)名稱(chēng)', function(oData){});注冊(cè)監(jiān)聽(tīng)的方法調(diào)用。
@ZKey("參數(shù)名稱(chēng)")：JS中Object參數(shù)鍵值名稱(chēng)。
@ZCmd("cmd名稱(chēng)")：用于
onZWebMessage方法回調(diào)中，cmd參數(shù)的映射。具體使用方法可以參考Demo。（針對(duì)Message做映射解析時(shí)使用）。
@ZJson：JS中Object參數(shù)的字符串（json）。
@ZData：參數(shù)為字符串。
- 創(chuàng)建接口服務(wù)對(duì)象實(shí)例，并進(jìn)行調(diào)用
mRequireService = mZWebInstance.create(RequireService.class);
通過(guò)使用 mRequireService 提供的方法，調(diào)用JS。如下：
mRequireService.callA("我是一個(gè)堅(jiān)挺的消息。。。", "小A你好?。?, time);
JS調(diào)用原生提供的方法
-
使用現(xiàn)有的
void onZWebMessage(IZWebHandler zWebHandler, String cmd, String data, IZMessageController controller);進(jìn)行方法解析，并異步返回結(jié)果。參數(shù)
cmd：定義的命令名稱(chēng)。參數(shù)
data： 定義的參數(shù)。controller：可進(jìn)行異步的結(jié)果返回?；蛘呃?controller.parseMessage(this.mParseMessage);此方法進(jìn)行方法解析。 -
使用原生
@JavascriptInterface注解的方法進(jìn)行擴(kuò)展。框架在 ZWebConfig 中提供了
setExposedName (String exposedName);方法，可以擴(kuò)展一個(gè)原生的接口協(xié)議名稱(chēng)。然后，利用
mZWebInstance.addJavascriptInterface(object);進(jìn)行對(duì)象中的方法注入。
iOS
暫無(wú)
Author Blog
作者：Zyao89；轉(zhuǎn)載請(qǐng)保留此行，謝謝；
原文網(wǎng)站：https://www.zyao89.cn
祝你好運(yùn)，謝謝支持
