当前位置: 代码迷 >> 综合 >> weex 和 native 的交互
  详细解决方案

weex 和 native 的交互

热度:24   发布时间:2024-02-27 16:36:54.0

先说一下 Android的扩展能力之module

一、module扩展 是用于weex和Android的数据交互。

有三点要注意的地方:
1、必须继承WXModule,并且不能被混淆
2、必须添加@JSMethod (uiThread = false or true) 注解,必须是public方法
3、module必须注册

数据交互就是通信。具体的厘子如下:

1、创建WeexCallBackModule类继承自 WXModule
2、创建两个方法

    方法1:call(String msg,JScallback callback) 带参数方法 根据注释可以看出,Android接收到weex的消息msg后,并给weex一个回复。
    方法2:jumpPage()  无参数方法,功能是页面跳转。仅提供给weex调用,不回复信息。

public class WeexCallBackModule extends WXModule {/*** 用于module注册* @return 返回类名*/public static String getLocalName(){return "WeexCallBackModule";}/*** * @param msg 来自于weex 的参数* @param callback weex 回调接口*/@JSMethod(uiThread = true)public void call(String msg, JSCallback callback){Log.d("nade", "call: 接收到weex="+msg);Toast.makeText(mWXSDKInstance.getContext(), "获取来自weex的数据"+msg, Toast.LENGTH_SHORT).show();callback.invoke("以收到weex端数据,回复告知。");}@JSMethod(uiThread = true)public void jumpPage(){mWXSDKInstance.getContext().startActivity(new Intent(mWXSDKInstance.getContext(), NavigatorActivity.class));}
}

 

3、注册module

WXSDKEngine.registerModule(WeexCallBackModule.getLocalName(),WeexCallBackModule.class);

二、Component 扩展 是用于weex和Android的ui交互。
说白了,Component 扩展就是Android自定义view交给weex使用的一种方式。

有三点要注意的地方:
1、必须继承WXComponent<View>,并指定View类型, 并且不能被混淆
2、必须添加@WXComponentProp(name = value ) 注解,value是属性值,提供给weex赋值使用。必须是public方法
3、Component 必须注册

参照官方写一个简单的富文本显示view

public class RichText extends WXComponent<TextView> {/*** 用于Component注册* @return 返回类名*/public static String getLocalName() {return "RichText";}/*** 构造方法* @param instance* @param parent* @param basicComponentData*/public RichText(WXSDKInstance instance, WXVContainer parent, BasicComponentData basicComponentData) {super(instance, parent, basicComponentData);}/*** 初始化view 定义view属性 并返回* @param context* @return*/@Overrideprotected TextView initComponentHostView(@NonNull Context context) {TextView view = new TextView(context);view.setTextSize(20);view.setTextColor(Color.BLUE);view.setBackground(context.getResources().getDrawable(R.drawable.richtextstyle));return view;}/*** 添加属性值 并设置显示。* @param telNumber weex 传递的需要显示的值*/@WXComponentProp(name = "tel")public void setTel(String telNumber){getHostView().setText(telNumber);}}

本文完。

  相关解决方案