一起来玩 Weex，kotlin 操作符重载

该用法我还没用过，不做解释，我把官方的贴出。

public void fireEvent(String elementRef,final String type, final Map<String, Object> data,final Map<String, Object> domChanges){ }

public void fireEvent(String elementRef,final String type, final Map<String, Object> data){fireEvent(elementRef,type,data,null);}

public void fireEvent(String elementRef, String type){fireEvent(ref,type,new HashMap<String, Object>());}

具体解释可以戳[这里](

)。这种方法用于 native 主动调 js。

事件回调

这种方法用于 js 调 native。

一种是带回调的，诸如：

public class WXLocation extends WXModule {@JSMethodpublic void getLocation(JSCallback callback){//获取定位代码.....Map<String,String> data=new HashMap<>();data.put("x","x");data.put("y","y");//通知一次 callback.invoke(data);//持续通知 callback.invokeAndKeepAlive(data);

//invoke 方法和 invokeAndKeepAlive 两个方法二选一}}

一种是不带回调的，诸如：

public class RouterModule extends WXModule {@JSMethod(uiThread = true)public void router(String url) {BrowserActivity.start(mWXSDKInstance.getContext(), url);}}

上面就是一个简单的路由，调用方法要用注解 JSMethod，后面是确定是否在主线程调用。

双方使用也很简单：

WXSDKEngine.registerModule("RouterModule", RouterModule.class);//跟自定义组件一样，必须在原生注册

weex.requireModule('RouterModule').router(item.url);

Android 扩展

确切来说应该是 Adapter 扩展，Adapter 顾名思义就是适配器，就是说 js 某些地方可能需要原生来实现达到性能最优。

常见有：

• IWXUserTrackAdapter：相关性能数据 (首屏加载时间、JS-Native 通信时间、dom 更新时间等) 和其他通用信息 (JSLib 文件大小, Weex SDK 版本号等

《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》
浏览器打开：qq.cn.hn/FTe 免费领取

)，好像可以用于埋点统计

• IWXDebugAdapter：从字面上就能确定这玩意拿来调试的

• IWXStorageAdapter：不多说，用来存储的

• IWXImgLoaderAdapter：用来图片加载的，默认并没有实现，下面会给出自己实现的代码

• IWXHttpAdapter：用来支持网络下载的，默认使用 HttpURLConnection，下面也会给出实现代码

public class WXImageAdapter implements IWXImgLoaderAdapter {@Overridepublic void setImage(String url, ImageView view, WXImageQuality quality, WXImageStrategy strategy) {

if (TextUtils.isEmpty(url)) {return;}final Context context = view.getContext();

if (url.startsWith("mipmap://")) {//加载本地资源...view.setImageResource(imgId);return;}

Glide.with(context).load(url).crossFade().into(view);}

private String getResIdStr(String url) {...return url.substring(start, end);}}

public class WXHttpAdapter implements IWXHttpAdapter {

private OkHttpClient mOkHttpClient;

public WXHttpAdapter(OkHttpClient okHttpClient) {mOkHttpClient = okHttpClient;}

@Overridepublic void sendRequest(WXRequest request, OnHttpListener listener) {

if (listener != null) {listener.onHttpStart();}

if (request == null) {if (listener != null) {WXResponse wxResponse = new WXResponse();wxResponse.errorMsg = "WXRequest 为空";listener.onHttpFinish(wxResponse);}return;}

Request okHttpRequest;if (Constant.POST.equalsIgnoreCase(request.method)) {okHttpRequest = (new Request.Builder()).headers(getHeaders(request)).url(request.url).post(RequestBody.create(MediaType.parse(request.body), request.body)).build();} else {okHttpRequest = (new okhttp3.Request.Builder()).url(request.url).build();}

mOkHttpClient.newCall(okHttpRequest).enqueue(new Callback() {@Overridepublic void onFailure(Call call, IOException e) {if (listener != null) {WXResponse wxResponse = new WXResponse();wxResponse.errorCode = String.valueOf(-100);wxResponse.statusCode = String.valueOf(-100);wxResponse.errorMsg = e.getMessage();try {listener.onHttpFinish(wxResponse);} catch (Exception e1) {LoggerUtil.d(e1.getMessage());}}}

@Overridepublic void onResponse(Call call, Response response) throws IOException {if (listener != null) {WXResponse wxResponse = new WXResponse();wxResponse.statusCode = String.valueOf(response.code());ResponseBody body = response.body();if (body == null) {wxResponse.errorMsg = "body 为空";} else {wxResponse.originalData = body.bytes();}try {listener.onHttpFinish(wxResponse);} catch (Exception e) {LoggerUtil.d(e.getMessage());}}}});}

@TargetApi(24)private Headers getHeaders(WXRequest request) {okhttp3.Headers.Builder builder = new okhttp3.Headers.Builder();if (request.paramMap != null) {Set<String> keySet = request.paramMap.keySet();keySet.forEach(key -> builder.add(key, request.paramMap.get(key)));}return builder.build();}}

代码篇幅比较长，但逻辑很简单，根据提供的参数 WXRequest 实现自己的网络请求，然后通过 OnHttpListener 回调给 JS，其中注意点是尽量把回调给 JS 的变量 WXResponse 参数传齐，不然可能导致网络请求失败。

其它

我猜很多哥们内心现在最想问的是 Android 原生到底如何执行 js 文件？Weex 的原理到底是什么？你那个效果图有 bug，滑动的时候 TabLayout 透明了，你行不行啊？

听我一一道来，关于 Weex 的[工作原理](

)的示意图如下：

对于这种原理我也是半知半解，无能为力了。

关于 Android 原生执行 js 文件一般有两种，一种是从网络上获取，一种直接执行本地的 js 文件。

mWXSDKInstance.render("GankioList", WXFileUtils.loadAsset("gankiolist.js", context), options, null, WXRenderStrategy.APPEND_ASYNC);mWXSDKInstance.renderByUrl();

前者是执行本地，后者是网络获取，我们常常会操作 options 以此给 js 传递一些 native 的参数。

关于最后一个问题，我也很无奈啊，原来这个项目就是卡片阴影背景，一开始发现 weex 也有这样的样式，欣喜若狂，后来发现这个问题，我一度以为我使用姿势错了，急忙回去看文档，天空飘来仅仅支持 ios 几个字。

为何 ios 这么叼？为何 ios 这么叼？为何 ios 这么叼？

杂谈

这算是对自己这几天学习 Weex 的一点小总结，小弟不才，已经尽力了，希望对想入门或者刚入门 Weex 的同学有所帮助，同时希望 Weex 的前辈能够指出其中错误。文中的代码已经集成到我开源项目[CrazyDaily](

)。学习 Weex 主要还是看重它基于 Vue，传说 Vue 是一位长得很帅的国人创立的，请给我一个理由不支持？大家学习的时候最好还是以官方文档为主，刚开始看不懂也正常，先通读一遍，然后自己敲 Demo 碰到问题再回去精读一遍。

最后，感谢一直支持我的人！传送门