扩展

Weex 提供了扩展机制,可以根据自己的业务进行定制自己的功能。

主要分为两类扩展:

Module 扩展 非 UI 的特定功能。例如 sendHttp、openURL 等。

Component 扩展 实现特别功能的 Native 控件。例如:RichTextview,RefreshListview 等。

Adapter 扩展 Weex 对一些基础功能实现了统一的接口,可实现这些接口来定制自己的业务。例如:图片下载等。

1. Module 扩展

1.1 什么是Module

module 是完成一个操作的方法集合,在 Weex 的页面中,允许开发者 require 引入,调用 module 中的方法,WeexSDK 在启动时候,已经注册了一些内置的 module。

Module 扩展必须继承 WXModule 类。

扩展方法必须加上@JSMethod (uiThread = false or true) 注解。Weex 会根据注解来判断当前方法是否要运行在 UI 线程,和当前方法是否是扩展方法。

Weex是根据反射来进行调用 Module 扩展方法,所以Module中的扩展方法必须是 public 类型。(不太理解,反射不是为所欲为的吗。)

同样因为是通过反射调用,Module 不能被混淆。

为了防止我们的应用程序被反编译,这时用到了混淆。混淆增大了反编译难度, 类和成员会被随机命名。因此, 涉及到这些反射调用的方法, 应避免混淆。

Module 扩展的方法可以使用 int, double, float, String, Map, List 类型的参数

完成 Module 后一定要在初始化时注册

在自己定义的Application中进行注册

// 注册方式

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

// js 调用如下

weex.requireModule('MyModule').printLog("I am a weex Module");

1.2 内置Module

registerModule("modal", WXModalUIModule.class, false);

registerModule("instanceWrap", WXInstanceWrap.class, true);

registerModule("animation", WXAnimationModule.class, true);

registerModule("webview", WXWebViewModule.class, true);

registerModule("navigator", WXNavigatorModule.class);

registerModule("stream", WXStreamModule.class);

registerModule("timer", WXTimerModule.class, false);

registerModule("storage", WXStorageModule.class, true);

registerModule("clipboard", WXClipboardModule.class, true);

registerModule("globalEvent",WXGlobalEventModule.class);

registerModule("picker", WXPickersModule.class);

registerModule("meta", WXMetaModule.class,true);

registerModule("webSocket", WebSocketModule.class);

1.3 自定义Module注册方式

public static boolean registerModule(String moduleName, Class moduleClass,boolean global) throws WXException

moduleName 前端代码中module的名称

moduleClass 是该module的Class, 需要提供一个默认的构造函数。

global 是否是全局唯一, true为全局唯一, false表示和WXSDKInstance绑定。

2. Component 扩展

2.1

Component 扩展类必须继承 WXComponent.

Component 对应的设置属性的方法必须添加注解

@WXComponentProp(name=value(value is attr or style of dsl))

Weex sdk 通过反射调用对应的方法,所以 Component 对应的属性方法必须是 public,并且不能被混淆。请在混淆文件中添加代码 -keep public class * extends com.taobao.weex.ui.component.WXComponent{*;}

Component 扩展的方法可以使用 int, double, float, String, Map, List 类型的参数

完成 Component 后一定要在初始化时注册

WXSDKEngine.registerComponent("richText", RichText.class);

JS 调用如下

12305

2.2 注册方式

2.2.1 方式一

// 效率最高

public static boolean registerComponent(IFComponentHolder holder, boolean appendTree, String ... names) throws WXException

参数含义:

holder 为一个抽象组件工厂,用于创建component,可使用 SimpleComponentHolder 来快速的构建该对象。

appendTree 为一个扩展标记位,目前暂无意义。

names 表示该 component 在前端代码中名称,可把多个前端组件名称映射成一个 component 。

实例:

// 在WXSDKEngine中的register()可见

registerComponent(

new SimpleComponentHolder(

WXText.class,

new WXText.Creator()

),

false,

WXBasicComponentType.TEXT

);

2.2.2 方式二

public static boolean registerComponent(String type, Class extends WXComponent> clazz, boolean appendTree) throws WXException

参数含义:

type 组件的名字, 也是JS的标签名

clazz 是组件的class文件

appendTree 为一个扩展标记位,目前暂无意义。

为什么方式一效率最高?

因为方式二会转换成方式一进行注册。中间无形之中多了一些不需要的步骤。

2.3 Component方法支持

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

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

@JSMethod

public void focus() {

//method implementation

}

@JSMethod是一定必须要的。

声明之后, 在vue文件中即可调用

module.exports = {

created: function() {

this.$refs.mycomponent.focus();

}

}

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

Adapter扩展

内置的Adapter,以下代码摘自InitConfig.Builder

IWXHttpAdapter httpAdapter; // default DefaultWXHttpAdapter

IWXImgLoaderAdapter imgAdapter; // defualt null

IDrawableLoader drawableLoader; // default null

IWXUserTrackAdapter utAdapter; // default null

IWXDebugAdapter debugAdapter; // default null

IWXStorageAdapter storageAdapter; // default DefaultWXStorage

IWXSoLoaderAdapter soLoader; // default null

URIAdapter mURIAdapter; // default DefaultUriAdapter

IWXJSExceptionAdapter mJSExceptionAdapter; // default null

IWXHttpAdapter: 用来处理网络请求的接口,常常处理请求一系列过程,默认实现DefaultWXHttpAdapter. 用的是HttpURLConnection

IWXImgLoaderAdapter: 用来处理View加载图片接口,可以实现其控制如何加载远程和本地图片.

接口定义如下

public interface IWXImgLoaderAdapter {

void setImage(String url, ImageView view, WXImageQuality quality,WXImageStrategy strategy);

}

WXImageQuality 表示图片的质量,WXImageQuality 取如下值 LOW, NORMAL, HIGH, ORIGINAL 图片质量依次变高。默认为 LOW。

WXImageStrategy 为扩展类,表示了图片是否可以裁剪 (isClipping) 锐化 (isSharpen) 占位符 (placeHolder) 等。

IWXUserTrackAdapter: 用来处理日志信息接口,常常拿来做一些用户埋点统计.

IWXStorageAdapter: 用来处理存储接口,例如SQLite存储,默认实现DefaultWXStorage.

IWXDebugAdapter: 用来处理调试接口,通常实现其接口来在Chrom上做一些页面的调试.

WXDomManager: 专门用来管理Dom节点一些操作,如创建节点对应对象,但真正操作是委托给其他的对象,

混淆

如果在项目中使用到了混淆, 则需要添加如下配置

-keep class com.taobao.weex.WXDebugTool{*;}

-keep class com.taobao.weex.devtools.common.LogUtil{*;}

-keepclassmembers class ** {

@com.taobao.weex.ui.component.WXComponentProp public *;

}

-keep class com.taobao.weex.bridge.**{*;}

-keep class com.taobao.weex.dom.**{*;}

-keep class com.taobao.weex.adapter.**{*;}

-keep class com.taobao.weex.common.**{*;}

-keep class * implements com.taobao.weex.IWXObject{*;}

-keep class com.taobao.weex.ui.**{*;}

-keep class com.taobao.weex.ui.component.**{*;}

-keep class com.taobao.weex.utils.**{

public ;

public ;

}

-keep class com.taobao.weex.view.**{*;}

-keep class com.taobao.weex.module.**{*;}

-keep public class * extends com.taobao.weex.common.WXModule{*;}

-keep public class * extends com.taobao.weex.ui.component.WXComponent{*;}

-keep class * implements com.taobao.weex.ui.IExternalComponentGetter{*;}

weex android 简书,Weex Extend相关推荐

  1. weex android 简书,weex打包Android和IOS

    1.安装weex npm i -g weex-toolkit weex -v // 查看当前weex工具版本 安装结束后你可以直接使用 weex help 命令验证是否安装成功,它会显示 weex 支 ...

  2. weex android 简书,Weex

    Weex 是使用流行的 Web 开发体验来开发高性能原生应用的框架.Weex 的目标就是使用开发者基于一份代码,编写出可以运行在 iOS,Android 和 Web 上的应用,并最大化地提高开发效率和 ...

  3. 大疆 android 简书,实测大疆智图与CC(Smart3D)三维建模、正射拼图对比

    本文授权转载于简书:三维GIS那点事_王跃军 部分有GIS前沿整理编辑 版权归原作者所有,转载请联系原作者 3月份大疆发布了"大疆智图"地面站,有基础版和专业版之分,基础班可以在大 ...

  4. 简书android,简书 - 一个基于内容分享的社区 - Android 应用 - 【最美应用】

    一款让人愿意逗留的 App 最开始打开简书的时候,让我印象最深的不是其简洁的界面和橘黄的配色,而是其流畅的操作和几乎可以忽略不计的反应时间,对稳定性和性能的优化让我在使用这款应用的时候非常踏实,不会因 ...

  5. ssr Android简书,渲染篇一:服务端渲染(SSR)

    导读 本文主要是从三个方面学习服务端渲染,内容整理自多个博客. 服务端渲染是什么?什么是服务端渲染?(服务端渲染的运行机制) 为什么使用服务端渲染?服务端渲染解决了什么问题? 什么情况下使用服务端渲染 ...

  6. android 简书饿了么,饿了吗

    你饿了吗?我饿了.所以我要自虐了. 图片发自简书App 我们食堂的菜拌面,现在看着都是个好吃的,土豆片就是有时候有点儿水水的,味道还不错.加了辣椒面裹了淀粉的豆腐圈也很好吃,吃一口面再吃一口菜,哭,好 ...

  7. provider android简书,Android 使用ContentProvider在应用间共享数据

    Android 使用ContentProvider在应用间共享数据 题图 www.gratisography.com 在开发的过程中,有时会有需求要实现应用程序之间实现数据共享,在Android系统中 ...

  8. weex android app例子,weex中修改android app图标和欢迎页

    修改欢迎页背景 1.图片放到platforms/android/app/src/main/res/drawable-xxxx下面,图片必须是png格式,否则会报错:然后修改platforms/andr ...

  9. android简书app源码,仿简书APP源码(android)

    [实例简介] [实例截图] [核心代码] package com.yidou.wandou.example_33.ui; import android.content.Context; import ...

最新文章

  1. Python常用函数与技巧总结(二)
  2. verilog 里面,always,assign和always@(*)区别
  3. MAC 升级到10.10(OS X Yosemite)下apache+php的配置问题
  4. 从零入门 Serverless | 函数计算的可观测性
  5. sql 2005 try catch
  6. 2019 .NET China Conf:路一直都在,社区会更好
  7. 前端学习(2700):重读vue电商网站21之如何导入全局样式表
  8. 第 3-3 课:泛型和迭代器 + 面试题
  9. python 读shell
  10. linux+tar+man,Linux常用命令
  11. php怎么输出汉字大写的时间,php汉字转首字母大写的方法是什么
  12. Atitit 提升开发效率 声明式编程范式 目录 1. 声明式编程体系树 1 1.1. 声明式(对比:指令式,,主要包括 函数式,逻辑式编程) 2 1.2. 声明式编程:表达与运行分离 3 1.3
  13. 【细胞分割】基于matlab GUI阙值+边缘+形态学+种子点图像分割【含Matlab源码 615期】
  14. 外星人笔记本没有修复计算机,外星人笔记本如何恢复出厂设置
  15. rk3288 android 6.0固件,RK3288固件升级教程
  16. 小程序实现轮播图跳转页面和小程序
  17. 【Java语言】交换两个数的数值
  18. 用3D再现2D偶像的可爱,Cygames【偶像大师 灰姑娘女孩】开发示例
  19. Linux 如何在 vi 里搜索关键字
  20. 前端性能优化指标 + 检测工具

热门文章

  1. 领扣刷题46--全排列
  2. 1169 分数系列
  3. 百度搜索不到自己的csdn博客?
  4. Java中重载的作用?
  5. 《测绘管理与法律法规》——地图管理
  6. oracle++dtcol,Oracle 灾备 -- DG 常用SQL
  7. 选择低功耗蓝牙芯片时应注意什么
  8. 华为笔记本换装linux双系统,传华为笔记本将采用双系统+二合一设计
  9. 开关电源学习(一) MP2315S简介
  10. ipv6协议与网络服务器有关,IPv6与IPv4协议网络中的双工通信差异