weex学习第二节

weex实现js调native方法和native回调js方法

学习weex时发现js调native方法和native调js方法非常频繁，特此先来记录一下
tips: 我当前使用的weex版本是0.11 版本不同可能会有bug

1. 自定义module 类继承 WXModule ,随便写一个方法,加上weex注解,如下

 package com.meijun.weextest;
 
 
import android.util.Log;
 import android.widget.Toast;
 
 
import com.taobao.weex.annotation.JSMethod;
 import com.taobao.weex.bridge.JSCallback;
 import com.taobao.weex.common.WXModule;
 import com.taobao.weex.common.WXModuleAnno;
 import com.taobao.weex.utils.WXLogUtils;
 
 
import java.util.HashMap;
 import java.util.Map;
 
 
public class MyModule extends WXModule {
 private static final String TAG = "MyModule";
 
 
@JSMethod(uiThread = true)
public void testAsyncCall(String s, JSCallback callback) {
    Log.e(TAG, "testAsyncCall: " + s);
    WXLogUtils.e("WXComponentASynTest :" + Thread.currentThread().getName());
    Map data = new HashMap<>();
    data.put("x", "滴滴");
    data.put("y", "叭叭");
    callback.invoke(data);


}
 
 
}
 

解释下方法上面的注解
module中一旦被jsmoethod方法标注则表示这个方法可以再js中被回调,其中uiThread表示这个方法是否在ui线程中执行;

好了不啰嗦了,下面实现js中的内容
新建we文件,编写下面的代码

重点看下script节点下的内容

第一行 const modal = weex.requireModule('myModule')
首先导入我们要使用的module,仔细看,我们导入的是myModule 并不是类名,为何这样导入,注意这里

QQ截图20170412090331.png

我们首先要在Application类下注册这样module因为这样weex才知道到哪里去找这个module而注册的key值就是我们导入依赖填入的key值.
tips: 这里有个坑,切记要先初始化WXSDKEngine 再注册modle否则weex会报找
到这个方法的异常.

未命名.jpg

didi(event)代表点击滴滴之后会回调这个方法,程序执行到这里,接下来就会回到modal.testAsyncCall方法,这个方法的实现是native方法,执行后,参数"点点滴滴"和匿名函数传给native.我们看下执行结果.

QQ截图20170412091930.png

在MyModule类中我们打印了js传过来的参数,接着我们回调js并且给js回传了数据
js中我们拿到了数据并打印出数据"滴滴叭叭".

`weex加载本地图片

官方文档中并没有告诉我们如何实现weex加载本地图
片,但是却给出了加载图片的接口,依据这个接口我们就可以实现加载本地的图片

jietu2117.png

我们重写imageadpter的setimage方法,此时我们可以拿到url 通过对url的判断如果使file:大头,我们认为他是要从本地读取文件,然后通过AndroidAPI拿到图片后直接给设置到imageview上.贴一下we文件中的处理

aobut.png

可见,我们直接在src属性下填写地址就可以了,同时如果要写远程服务器上的图片地址也是不会有影响的.