参考:开发HelloWorld程序(Weex开发)javascript
一、建立Android工程 二、集成WeexSDK,参考[WEEX SDK 集成到 Android 工程](https://weex-project.io/cn/doc/advanced/integrate-to-android.html) 三、开发.we源码 四、编译.we源码为js文件,将js文件复制到Android工程的asset目录下 五、初始化sdk 六、实现渲染
WXSample地址 https://github.com/xkli/WXSample.githtml
如何自定义 native 组件?java
1.自定义组件必须继承自 WXComponent 或者 WXContainer ; 2.weex SDK 能够识别 @WXComponentProp (name = value(value 是 attr 或者 dsl style)); 3.方法必须是 public 的; 4.组件类不能是一个内部类; 5.自定义组件不能被 ProGuard 之类的工具混淆; 6.组件方法在 UI 线程被调用,所以不要在里面进行耗时的操做; 7.Weex 的参数类型能够是 int, double, float, String, Map, List 和实现了 WXObject 接口的自定义类;
参考如下例子:node
package com.taobao.weex.ui.component; // …… public class MyViewComponent extends WXComponent{ public MyViewComponent(WXSDKInstance instance, WXDomObject node, WXVContainer parent, String instanceId, boolean lazy) { super(instance, node, parent, instanceId, lazy); } @Override protected void initView() { //TODO:your own code …… } @Override public WXFrameLayout getView() { //TODO:your own code ……… } @WXComponentProp(name=WXDomPropConstant.WX_ATTR_VALUE) public void setMyViewValue(String value) { ((TextView)mHost).setText(value); } }
必须注册组件:android
WXSDKEngine.registerComponent("MyView", MyViewComponent.class);
Weex 的 SDK 只提供了页面渲染的能力,可是一些其它操做,好比网络请求、图片加载、重定向等功能须要你本身去实现,这个例子讲述了如何用原生代码去扩展 Weex 的功能。github
关于 URLHelper 的例子api
新建一个 WXModuleweex
public class URLHelperModule extends WXModule{ private static final String WEEX_CATEGORY="com.taobao.android.intent.category.WEEX"; @JsMethod public void openURL(String url){ if (TextUtils.isEmpty(url)) { return; } StringBuilder builder=new StringBuilder("http:"); builder.append(url); Uri uri = Uri.parse(builder.toString()); Intent intent = new Intent(Intent.ACTION_VIEW, uri); intent.addCategory(WEEX_CATEGORY); mWXSDKInstance.getContext().startActivity(intent); } }
这里要注意 @JsMethod 这个注解,它表示了你把这个方法暴露给 JavaScript。网络
public class URLHelperModule extends WXModule{ @JsMethod public void openURL(String url,String callbackId){ //... //callback to javascript Map<String, Object> result = new HashMap<String, Object>(); result.put("ts", System.currentTimeMillis()); WXBridgeManager.getInstance().callback(mWXSDKInstance.getInstanceId(), callbackId, result); } }
把module注册到WXSDKEngine:
try { WXSDKEngine.registerModule("myURL", URLHelperModule.class); //'myURL' is the name you'll use in javascript } catch (WXException e) { WXLogUtils.e(e.getMessage()); }
在 JavaScript 中使用 eventModule:
let URLHelper = require('@weex-module/myURL');//same as you registered URLHelper.openURL("http://www.taobao.com",function(ts){ console.log("url is open at "+ts); });
一些注意事项:
定义一个 components 须要继承 WXModule 不要忘记添加 @WXModuleAnno 注解,否则 Weex 无法识别这个方法 定义的方法必须是 `public 的 module 类必定不能是内部类 你定义的 components 不能被混淆,否则会找不到 Module 中的方法会在 UI 线程中被调用,因此必定不要作一些耗时操做 Moudle 中的方法参数类型能够为 int,double,float,String,Map,List,以及实现 WXObject 接口的类。