#Weex與Android交互（一）

用Weex開發Android程序

參考：開發HelloWorld程序（Weex開發）

一、建立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.git

Weex擴展到Android（自定義組件）

自定義組件（Android）

如何自定義 native 組件？

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 接口的自定義類；

參考如下例子：

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);
      }

}

必須註冊組件：

WXSDKEngine.registerComponent("MyView", MyViewComponent.class);

自定義原生API

如何自定義 native API？

Weex 的 SDK 只提供了頁面渲染的能力，可是一些其它操做，好比網絡請求、圖片加載、重定向等功能須要你本身去實現，這個例子講述瞭如何用原生代碼去擴展 Weex 的功能。

關於 URLHelper 的例子

新建一個 WXModule

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 接口的類。