weex-android添加返回按钮监听

概述

在一些场景中需要在选择内容后回传，例如地址选择、日期选择等。
如果用两个页面来传递信息会使逻辑变得复杂，所以我们在开发过程中选择添加一个蒙层来进行选择操作（我们使用weex-ui的wxc-popup）。
但是这会带来另一个问题，在android手机上按返回键时整个页面都会返回，所以我们写了一个module来进行back按钮的监听。

android代码部分

创建BackEventModule

public class BackEventModule extends WXModule {

    // 存放 InstanceId 和对应的 JSCallback
    public static final HashMap<String, JSCallback> backListener = new HashMap<>();

    @JSMethod
    public void addBackEventListener(JSCallback callback) {
        backListener.put(mWXSDKInstance.getInstanceId(), callback);
    }

    @JSMethod
    public void removeBackEventListener() {
        backListener.remove(mWXSDKInstance.getInstanceId());
    }

    // 给activity在onBackPressed()中调用
    public static boolean fireBackEvent(WXSDKInstance mInstance) {
        if (XDEventModule.backListener.containsKey(mInstance.getInstanceId())) {
            JSCallback callback = XDEventModule.backListener.get(mInstance.getInstanceId());
            if (null != callback) {
                Map<String, Boolean> result = new HashMap<>();
                result.put("ok", true);
                callback.invoke(result);
            }
            return true;
        }
        return false;
    }
}

在WXPageActivity添加处理代码

@Override
public void onBackPressed() {
    //mInstance 为 WXSDKInstance 实例
    if (BackEventModule.fireBackEvent(mInstance)) {
        return;
    }
    super.onBackPressed();
}
// 如果有其他activity也加载weex页面，也需要添加此段代码

在weex中使用

// 以下为示例代码
openPopup(){
  // 打开Popup时增加监听
  if(this.isAndroid){
    const backEvent = weex.requireModule('backEvent');
    backEvent.addBackEventListener(e=>{
      // back按钮事件监听回调中隐藏Popup
      hideAddressPopup();
    })
  }  
},
hidePopup(){
  // 隐藏Popup方法中移除监听，使back按钮能恢复原有逻辑
  if(this.isAndroid){
    const backEvent = weex.requireModule('backEvent');
    backEvent.removeBackEventListener();
  }
},
isAndroid() {
  let {platform} = weex.config.env
  return platform.toLowerCase() === 'android'
},

我的博客https://blog.marekchen.kim