• Android 扩展
    • Module 扩展
    • Component 扩展
      • 组件方法支持
  • Adapter扩展
    • SDK混淆规则

    Android 扩展

    Weex 提供了扩展机制,可以根据自己的业务进行定制自己的功能。
    主要分为两类扩展:

    • Module 扩展 非 UI 的特定功能。例如 sendHttp、openURL 等。
    • Component 扩展 实现特别功能的 Native 控件。例如:RichTextview,RefreshListview 等。
    • Adapter 扩展 Weex 对一些基础功能实现了统一的接口,可实现这些接口来定制自己的业务。例如:图片下载等。

    Module 扩展

    1. Module 扩展必须继承 WXModule 类。
    2. 扩展方法必须加上@JSMethod (uiThread = false or true) 注解。Weex 会根据注解来判断当前方法是否要运行在 UI 线程,和当前方法是否是扩展方法。
    3. Weex是根据反射来进行调用 Module 扩展方法,所以Module中的扩展方法必须是 public 类型。
    4. 同样因为是通过反射调用,Module 不能被混淆。请在混淆文件中添加代码:-keep public class * extends com.taobao.weex.common.WXModule{*;}
    5. Module 扩展的方法可以使用 int, double, float, String, Map, List 类型的参数
    6. 完成 Module 后一定要在初始化时注册 WXSDKEngine.registerModule("myModule", MyModule.class); 否则会报类似错误:ReportException :undefined:9: TypeError: Object #<Object> has no method 'printLog'

    示例如下:

    1. public class MyModule extends WXModule{
    2. //run ui thread
    3. @JSMethod (uiThread = true)
    4. public void printLog(String msg) {
    5. Toast.makeText(mWXSDKInstance.getContext(),msg,Toast.LENGTH_SHORT).show();
    6. }
    7. //run JS thread
    8. @JSMethod (uiThread = false)
    9. public void fireEventSyncCall(){
    10. //implement your module logic here
    11. }
    12. }

    Register the module

    1. WXSDKEngine.registerModule("MyModule", WXEventModule.class);

    JS 调用如下:

    1. <template>
    2. <div>
    3. <text onclick="click">testMyModule</text>
    4. </div>
    5. </template>
    6. <script>
    7. module.exports = {
    8. methods: {
    9. click: function() {
    10. weex.requireModule('myModule').printLog("I am a weex Module");
    11. }
    12. }
    13. }
    14. </script>

    Component 扩展

    1. Component 扩展类必须集成 WXComponent.
    2. Component 对应的设置属性的方法必须添加注解 @WXComponentProp(name=value(value is attr or style of dsl))
    3. Weex sdk 通过反射调用对应的方法,所以 Component 对应的属性方法必须是 public,并且不能被混淆。请在混淆文件中添加代码 -keep public class * extends com.taobao.weex.ui.component.WXComponent{*;}
    4. Component 扩展的方法可以使用 int, double, float, String, Map, List 类型的参数
    5. 完成 Component 后一定要在初始化时注册 WXSDKEngine.registerComponent("richtext",RichText.class);

    示例如下:

    1. public class RichText extends WXComponent {
    2. public RichText(WXSDKInstance instance, WXDomObject dom, WXVContainer parent, boolean isLazy) {
    3. super(instance, dom, parent, isLazy);
    4. }
    5. @Override
    6. protected void initView() {
    7. mHost=new TextView(mContext);
    8. ((TextView)mHost).setMovementMethod(LinkMovementMethod.getInstance());
    9. }
    10. @WXComponentProp(name = "tel")
    11. public void setTelLink(String tel){
    12. SpannableString spannable=new SpannableString(tel);
    13. spannable.setSpan(new URLSpan("tel:"+tel),0,tel.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    14. ((TextView)mHost).setText(spannable);
    15. }
    16. }

    注册你的组件:

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

    JS 调用如下:

    1. <template>
    2. <div>
    3. <richText tel="12305" style="width:200;height:100">12305</richText>
    4. </div>
    5. </template>

    组件方法支持

    从WeexSDK 0.9.5开始,你可以定义组件方法

    • 在组件中如下声明一个组件方法

      1. @JSMethod
      2. public void focus(){
      3. //method implementation
      4. }
    • 注册组之后,你可以在weex 文件中调用

      1. <template>
      2. <mycomponent ref='mycomponent'></mycomponent>
      3. </template>
      4. <script>
      5. module.exports = {
      6. created: function() {
      7. this.$refs.mycomponent.focus();
      8. }
      9. }
      10. </script>

    注:工程要添加依赖 compile 'com.squareup.picasso:picasso:2.5.2'

    Adapter扩展

    图片下载:

    需要时集成接口 IWXImgLoaderAdapter,实现 setImage 方法。

    示例如下:

    1. public class ImageAdapter implements IWXImgLoaderAdapter {
    2. public ImageAdapter() {
    3. }
    4. @Override
    5. public void setImage(final String url, final ImageView view,
    6. WXImageQuality quality, WXImageStrategy strategy) {
    7. WXSDKManager.getInstance().postOnUiThread(new Runnable() {
    8. @Override
    9. public void run() {
    10. if(view==null||view.getLayoutParams()==null){
    11. return;
    12. }
    13. if (TextUtils.isEmpty(url)) {
    14. view.setImageBitmap(null);
    15. return;
    16. }
    17. String temp = url;
    18. if (url.startsWith("//")) {
    19. temp = "http:" + url;
    20. }
    21. if (view.getLayoutParams().width <= 0 || view.getLayoutParams().height <= 0) {
    22. return;
    23. }
    24. Picasso.with(WXEnvironment.getApplication())
    25. .load(temp)
    26. .into(view);
    27. }
    28. },0);
    29. }
    30. }

    SDK混淆规则

    若要在APP中使用混淆,请在相应的配置文件中添加如下规则:

    1. -keep class com.taobao.weex.WXDebugTool{*;}
    2. -keep class com.taobao.weex.devtools.common.LogUtil{*;}
    3. -keepclassmembers class ** {
    4. @com.taobao.weex.ui.component.WXComponentProp public *;
    5. }
    6. -keep class com.taobao.weex.bridge.**{*;}
    7. -keep class com.taobao.weex.dom.**{*;}
    8. -keep class com.taobao.weex.adapter.**{*;}
    9. -keep class com.taobao.weex.common.**{*;}
    10. -keep class * implements com.taobao.weex.IWXObject{*;}
    11. -keep class com.taobao.weex.ui.**{*;}
    12. -keep class com.taobao.weex.ui.component.**{*;}
    13. -keep class com.taobao.weex.utils.**{
    14. public <fields>;
    15. public <methods>;
    16. }
    17. -keep class com.taobao.weex.view.**{*;}
    18. -keep class com.taobao.weex.module.**{*;}
    19. -keep public class * extends com.taobao.weex.common.WXModule{*;}
    20. -keep public class * extends com.taobao.weex.ui.component.WXComponent{*;}
    21. -keep class * implements com.taobao.weex.ui.IExternalComponentGetter{*;}